From c12fece85571b4d2f3b5accd74729bef14e1ed63 Mon Sep 17 00:00:00 2001 From: Fedor Katurov Date: Thu, 21 Mar 2024 11:24:25 +0000 Subject: [PATCH] Update Certbot well-known auto renew script --- docs/200.html | 2 +- docs/404.html | 2 +- docs/_payload.js | 2 +- docs/about/_payload.js | 2 +- docs/about/index.html | 2 +- docs/api/_content/cache.json | 2 +- docs/api/_content/query/068glZS8Mz.json | 2 +- docs/api/_content/query/1Q9jaWh0XH.json | 2 +- docs/api/_content/query/23vTOdYUTM.json | 2 +- docs/api/_content/query/2vMf3x3doM.json | 2 +- docs/api/_content/query/4AUGrl0JGY.json | 2 +- docs/api/_content/query/8cFyiEqgoq.json | 2 +- docs/api/_content/query/CMMQ5oxSPg.json | 2 +- docs/api/_content/query/DliR2N9mzp.json | 2 +- docs/api/_content/query/EH6LeCIDqM.json | 2 +- docs/api/_content/query/FLiVxDo2qK.json | 2 +- docs/api/_content/query/FVXoGazg6u.json | 2 +- docs/api/_content/query/KIXVn92YTN.json | 2 +- docs/api/_content/query/LKdFxpydAG.json | 2 +- docs/api/_content/query/Llpj9LBd4i.json | 2 +- docs/api/_content/query/O9PBAkuWXG.json | 2 +- docs/api/_content/query/PwERR4vHv2.json | 2 +- docs/api/_content/query/QqziXmSF9l.json | 2 +- docs/api/_content/query/R77EQlrPEJ.json | 2 +- docs/api/_content/query/S7L9CBleOj.json | 2 +- docs/api/_content/query/SEkBVlx0jP.json | 2 +- docs/api/_content/query/TvYXYGXdZ0.json | 2 +- docs/api/_content/query/UBl6xR2vxQ.json | 2 +- docs/api/_content/query/WJQDeZ21lK.json | 2 +- docs/api/_content/query/WO7KYRkFiw.json | 2 +- docs/api/_content/query/WUiUHbO5Pg.json | 2 +- docs/api/_content/query/XgydJZDPap.json | 2 +- docs/api/_content/query/a1s3E9iAyd.json | 2 +- docs/api/_content/query/aP6pCxBj14.json | 2 +- docs/api/_content/query/arOc40mIpI.json | 2 +- docs/api/_content/query/cft4lrDUKB.json | 2 +- docs/api/_content/query/eIcZslqPOz.json | 2 +- docs/api/_content/query/epeSDkttbj.json | 2 +- docs/api/_content/query/fXI9pPDQUP.json | 2 +- docs/api/_content/query/gviYR2nAXj.json | 2 +- docs/api/_content/query/iZIUw8pCoM.json | 2 +- docs/api/_content/query/ki2hTtdZ9z.json | 2 +- docs/api/_content/query/kmbybMtElx.json | 2 +- docs/api/_content/query/pVAGVLBNPu.json | 2 +- docs/api/_content/query/pv8ckH0an3.json | 2 +- docs/api/_content/query/rNRhET0KmZ.json | 2 +- docs/api/_content/query/sxx5hHqDHF.json | 2 +- docs/api/_content/query/v8MG1Q8wMg.json | 2 +- docs/api/_content/query/wOOxKhEEuc.json | 2 +- docs/api/_content/query/xbO7aWQkpQ.json | 2 +- docs/blockchain/common-typescript-examples/_payload.js | 2 +- docs/blockchain/common-typescript-examples/index.html | 2 +- docs/blockchain/smart-contracts/_payload.js | 2 +- docs/blockchain/smart-contracts/index.html | 2 +- docs/contacts/_payload.js | 2 +- docs/contacts/index.html | 2 +- .../automatic-grid-like-masonry-with-pure-css/_payload.js | 2 +- .../automatic-grid-like-masonry-with-pure-css/index.html | 2 +- docs/css/sass-nth-child-iterate-mixin/_payload.js | 2 +- docs/css/sass-nth-child-iterate-mixin/index.html | 2 +- docs/css/test-if-browser-supports-css-rules/_payload.js | 2 +- docs/css/test-if-browser-supports-css-rules/index.html | 2 +- docs/docker/building-static-pages-with-docker/_payload.js | 2 +- docs/docker/building-static-pages-with-docker/index.html | 2 +- .../docker/common-things-with-docker-mailserver/_payload.js | 2 +- docs/docker/common-things-with-docker-mailserver/index.html | 4 ++-- docs/docker/drone-ci/_payload.js | 2 +- docs/docker/drone-ci/index.html | 2 +- docs/docker/github-pages-with-drone-ci/_payload.js | 2 +- docs/docker/github-pages-with-drone-ci/index.html | 2 +- docs/docker/private-docker-registry/_payload.js | 2 +- docs/docker/private-docker-registry/index.html | 2 +- docs/docker/refresh-containers-on-pull/_payload.js | 2 +- docs/docker/refresh-containers-on-pull/index.html | 2 +- docs/docker/seed-dump-inside-docker/_payload.js | 2 +- docs/docker/seed-dump-inside-docker/index.html | 2 +- docs/docker/wait-for-mysql/_payload.js | 2 +- docs/docker/wait-for-mysql/index.html | 2 +- docs/docker/wait-for-redis/_payload.js | 2 +- docs/docker/wait-for-redis/index.html | 2 +- docs/frontend/react-native/oauth2-login/_payload.js | 2 +- docs/frontend/react-native/oauth2-login/index.html | 2 +- .../_payload.js | 2 +- .../index.html | 2 +- .../frontend/react-native/react-native-app-auth/_payload.js | 2 +- docs/frontend/react-native/react-native-app-auth/index.html | 2 +- docs/frontend/react-native/useful-comands/_payload.js | 2 +- docs/frontend/react-native/useful-comands/index.html | 2 +- .../frontend/react/axios-refresh-token-on-react/_payload.js | 2 +- docs/frontend/react/axios-refresh-token-on-react/index.html | 2 +- docs/frontend/react/axios-with-abortcontroller/_payload.js | 2 +- docs/frontend/react/axios-with-abortcontroller/index.html | 2 +- .../_payload.js | 2 +- .../index.html | 2 +- docs/frontend/vue/add-global-variable-to-window/_payload.js | 2 +- docs/frontend/vue/add-global-variable-to-window/index.html | 2 +- .../vue/adding-global-properties-to-component/_payload.js | 2 +- .../vue/adding-global-properties-to-component/index.html | 2 +- .../vue/make-nuxt-handle-obsidian-highlights/_payload.js | 2 +- .../vue/make-nuxt-handle-obsidian-highlights/index.html | 2 +- .../webgl/basics-of-webgl-(drawing-a-cube)/_payload.js | 2 +- .../webgl/basics-of-webgl-(drawing-a-cube)/index.html | 2 +- docs/frontend/webgl/fragment-shaders/_payload.js | 2 +- docs/frontend/webgl/fragment-shaders/index.html | 2 +- .../rendering-without-blocking-in-a-worker/_payload.js | 2 +- .../webgl/rendering-without-blocking-in-a-worker/index.html | 2 +- docs/frontend/webgl/vertex-shaders/_payload.js | 2 +- docs/frontend/webgl/vertex-shaders/index.html | 2 +- docs/git/force-git-to-use-https/_payload.js | 2 +- docs/git/force-git-to-use-https/index.html | 2 +- docs/git/git-aliases-and-useful-commands/_payload.js | 2 +- docs/git/git-aliases-and-useful-commands/index.html | 2 +- docs/golang/i18n-in-golang/_payload.js | 2 +- docs/golang/i18n-in-golang/index.html | 2 +- docs/graphql/apollo-client-pagination/_payload.js | 2 +- docs/graphql/apollo-client-pagination/index.html | 2 +- docs/graphql/refresh-token-in-apollo-client/_payload.js | 2 +- docs/graphql/refresh-token-in-apollo-client/index.html | 4 ++-- docs/index.html | 2 +- docs/linux/certbot-well-known-auto-renew/_payload.js | 2 +- docs/linux/certbot-well-known-auto-renew/index.html | 2 +- docs/linux/find-out-who-uses-swap/_payload.js | 2 +- docs/linux/find-out-who-uses-swap/index.html | 2 +- docs/linux/fixing-lagging-usb-headphones/_payload.js | 2 +- docs/linux/fixing-lagging-usb-headphones/index.html | 2 +- docs/linux/gitea-for-git-hosting/_payload.js | 2 +- docs/linux/gitea-for-git-hosting/index.html | 2 +- .../google-photos-alternative-with-photoprism/_payload.js | 2 +- .../google-photos-alternative-with-photoprism/index.html | 2 +- docs/linux/linux-on-asus-zenbook-um3402-ya/_payload.js | 2 +- docs/linux/linux-on-asus-zenbook-um3402-ya/index.html | 2 +- docs/linux/resume-or-start-screen-session/_payload.js | 2 +- docs/linux/resume-or-start-screen-session/index.html | 2 +- docs/linux/rsync-file-with-ssh/_payload.js | 2 +- docs/linux/rsync-file-with-ssh/index.html | 2 +- docs/linux/setting-up-nginx/_payload.js | 2 +- docs/linux/setting-up-nginx/index.html | 4 ++-- docs/linux/ssh/_payload.js | 2 +- docs/linux/ssh/index.html | 2 +- .../self-hosted-obsidian-sync-with-couchdb/_payload.js | 2 +- .../self-hosted-obsidian-sync-with-couchdb/index.html | 4 ++-- docs/sql/mysql-and-mariadb-setup/_payload.js | 2 +- docs/sql/mysql-and-mariadb-setup/index.html | 2 +- docs/sql/postgress-setup/_payload.js | 2 +- docs/sql/postgress-setup/index.html | 6 +++--- docs/typescript/add-global-variable-to-window/_payload.js | 2 +- docs/typescript/add-global-variable-to-window/index.html | 2 +- docs/typescript/flatten-object-with-periods/_payload.js | 2 +- docs/typescript/flatten-object-with-periods/index.html | 2 +- .../vue/adding-global-properties-to-component/_payload.js | 2 +- .../vue/adding-global-properties-to-component/index.html | 2 +- docs/typescript/type-guards/_payload.js | 2 +- docs/typescript/type-guards/index.html | 2 +- 153 files changed, 159 insertions(+), 159 deletions(-) diff --git a/docs/200.html b/docs/200.html index 1d492ed..ed26b59 100644 --- a/docs/200.html +++ b/docs/200.html @@ -2,5 +2,5 @@ -
+
\ No newline at end of file diff --git a/docs/404.html b/docs/404.html index 1d492ed..ed26b59 100644 --- a/docs/404.html +++ b/docs/404.html @@ -2,5 +2,5 @@ -
+
\ No newline at end of file diff --git a/docs/_payload.js b/docs/_payload.js index 1b55ed9..9d3b173 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:1711020005767} \ 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:1711020221374} \ No newline at end of file diff --git a/docs/about/_payload.js b/docs/about/_payload.js index c08b15b..8190e49 100644 --- a/docs/about/_payload.js +++ b/docs/about/_payload.js @@ -1 +1 @@ -export default {data:{},prerenderedAt:1711020005547} \ No newline at end of file +export default {data:{},prerenderedAt:1711020221148} \ No newline at end of file diff --git a/docs/about/index.html b/docs/about/index.html index 05e30a9..3fc1ffe 100644 --- a/docs/about/index.html +++ b/docs/about/index.html @@ -8,5 +8,5 @@ Beeing initially written with Drupal 5, went through refactoring to Laravel + Vu Implements automatic route building with OSRM and map rasterization with canvas. Used by users in local cycling communities for ride sharing.
Code Visit
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.
+Made with nuxt3, nuxt-content plugin and some customizations. Deployed with drone-ci directly to github-pages.
Code Visit
\ No newline at end of file diff --git a/docs/api/_content/cache.json b/docs/api/_content/cache.json index 4282ef1..5324261 100644 --- a/docs/api/_content/cache.json +++ b/docs/api/_content/cache.json @@ -1 +1 @@ -{"generatedAt":1711020011493,"generateTime":80,"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-226c8e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"children":[{"type":"text","value":"// URL of your node"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'https://...'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-940990"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a35ac1"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-446270"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-940990"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-b0eabc"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-446270"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d811b"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-940990"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-41a6ec"},"children":[{"type":"text","value":"// first we need to authorize"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"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-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getCurrentAddressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getTransactionCount"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" gasLimit: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" nonce: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"EthUtil"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"Transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"sign"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"serialize"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"this"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"`0x${"}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-5ce9b7"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-5ce9b7"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'hex'"}]},{"type":"element","tag":"span","props":{"class":"ct-5ce9b7"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-226c8e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"estimateFee"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"asciiToHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" })."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"fromWei"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f2dcb5"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"())"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"multiply"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f2dcb5"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"()))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-226c8e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'accountsChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-dde42d"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'chainChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"handler"}]},{"type":"element","tag":"span","props":{"class":"ct-dbcf14"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-dde42d"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"ethereum"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'wallet_watchAsset'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" params: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" type: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'ERC20'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" options: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" address: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'0xb60e8dd61c5d32be8058bb8eb970870f07233155'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'FOO'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-d68aa3"},"children":[{"type":"text","value":"18"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" image: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'https://foo.io/token-image.svg'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-a35ac1"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-b0eabc"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-940990"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'FOO successfully added to wallet!'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f2dcb5"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'Something went wrong.'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getChainID"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'eth_chainId'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-226c8e"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'wallet_switchEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" params: [{ chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }], "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"switchError"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"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-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d68aa3"},"children":[{"type":"text","value":"4902"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'wallet_addEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" params: [{ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" chainName: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'Ropsten Test Network'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" nativeCurrency: { "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" name: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-d68aa3"},"children":[{"type":"text","value":"18"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" rpcUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"], "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" blockExplorerUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'https://ropsten.etherscan.io'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }] ,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"addError"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"children":[{"type":"text","value":"// handle \"add\" error"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"children":[{"type":"text","value":"// handle other \"switch\" errors"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-d68aa3{color:#79C0FF}.ct-dbcf14{color:#C9D1D9}.ct-f2dcb5{color:#79C0FF}.ct-5ce9b7{color:#A5D6FF}.ct-4d811b{color:#79C0FF}.ct-b0eabc{color:#FFA657}.ct-446270{color:#FF7B72}.ct-a35ac1{color:#D2A8FF}.ct-b083a6{color:#C9D1D9}.ct-940990{color:#FF7B72}.ct-06153f{color:#D2A8FF}.ct-ed33ff{color:#79C0FF}.ct-123e61{color:#FF7B72}.ct-41a6ec{color:#8B949E}.ct-e623ce{color:#A5D6FF}.ct-dde42d{color:#C9D1D9}.ct-20fec6{color:#C9D1D9}.ct-226c8e{color:#FF7B72}.light .ct-226c8e{color:#859900}.light .ct-20fec6{color:#657B83}.light .ct-dde42d{color:#268BD2}.light .ct-e623ce{color:#2AA198}.light .ct-41a6ec{color:#93A1A1}.light .ct-123e61{color:#073642}.light .ct-ed33ff{color:#268BD2}.light .ct-06153f{color:#268BD2}.light .ct-940990{color:#073642}.light .ct-b083a6{color:#657B83}.light .ct-a35ac1{color:#268BD2}.light .ct-446270{color:#859900}.light .ct-b0eabc{color:#657B83}.light .ct-4d811b{color:#859900}.light .ct-5ce9b7{color:#657B83}.light .ct-f2dcb5{color:#859900}.light .ct-dbcf14{color:#859900}.light .ct-d68aa3{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-167112"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'web3-eth-contract'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ce6629"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"abi"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"object"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0359ef"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f83aa"},"children":[{"type":"text","value":"JSON"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0359ef"},"children":[{"type":"text","value":"parse"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-605c85"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-605c85"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-04e485"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// ABI of contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// address for contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ({}) "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// Calling write method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// authorizing with Metamask"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// getting wallet address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// current user's wallet"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5788b0"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'Parameter'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"send"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" from: "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3e375"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// calling read method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// this method can return data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"retrieve"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3e375"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-04e485"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// ABI контракта"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// contract address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// account's private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// write-methods requires private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ce6629"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"privateKeyToAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" to: "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"encodeABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" gas: "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"({ from: "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"signTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"rawTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"requests"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"balanceOf"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getStaked"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"call"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ce6629"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"any"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"[]) "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getWeb3NoAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"BatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"map"}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"add"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"execute"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3e375"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"all"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a60ae2"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-605c85"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-605c85"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'YOUR_RPC_ENDPOINT_HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'YOUR ABI HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'YOUR CONTRACT ADDRESS HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-78b2a1"},"children":[{"type":"text","value":"referralProgramContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"events"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"RegisterUser"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-ce6629"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5a3490"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"`| UserRegistered | events | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"boolean"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e2e842"},"children":[{"type":"text","value":"RegisterUserResponseInterface"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"`| ONCE | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-ce6629"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5a3490"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e2e842"},"children":[{"type":"text","value":"ErrnoException"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" value: [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-5788b0"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"events"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"Transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"str"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-5788b0"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" address: ["}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'address-1'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'address-2'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"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-f25d6a"},"children":[{"type":"text","value":" topics: [] "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"//What topics to subscribe to"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'logs'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"nr"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"//example options(optional)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"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-f25d6a"},"children":[{"type":"text","value":" value: ["}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'1000'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'1337'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// number | \"earliest\" | \"pending\" | \"latest\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-5788b0"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" toBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'latest'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getPastEvents"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'Transfer'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"results"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e2e842{color:#FFA657}.ct-5a3490{color:#A5D6FF}.ct-a60ae2{color:#79C0FF}.ct-a3e375{color:#79C0FF}.ct-5788b0{color:#79C0FF}.ct-10950e{color:#79C0FF}.ct-253c68{color:#FF7B72}.ct-04e485{color:#8B949E}.ct-605c85{color:#FFA657}.ct-d8533d{color:#D2A8FF}.ct-4f83aa{color:#79C0FF}.ct-0359ef{color:#79C0FF}.ct-1ed67f{color:#79C0FF}.ct-895378{color:#FFA657}.ct-3d4b19{color:#FF7B72}.ct-ce6629{color:#D2A8FF}.ct-08c842{color:#C9D1D9}.ct-6a6b94{color:#FF7B72}.ct-7ab707{color:#A5D6FF}.ct-78b2a1{color:#C9D1D9}.ct-f25d6a{color:#C9D1D9}.ct-167112{color:#FF7B72}.light .ct-167112{color:#859900}.light .ct-f25d6a{color:#657B83}.light .ct-78b2a1{color:#268BD2}.light .ct-7ab707{color:#2AA198}.light .ct-6a6b94{color:#073642}.light .ct-08c842{color:#657B83}.light .ct-ce6629{color:#268BD2}.light .ct-3d4b19{color:#859900}.light .ct-895378{color:#657B83}.light .ct-1ed67f{color:#859900}.light .ct-0359ef{color:#268BD2}.light .ct-4f83aa{color:#657B83}.light .ct-d8533d{color:#268BD2}.light .ct-605c85{color:#657B83}.light .ct-04e485{color:#93A1A1}.light .ct-253c68{color:#073642}.light .ct-10950e{color:#268BD2}.light .ct-5788b0{color:#D33682}.light .ct-a3e375{color:#859900}.light .ct-a60ae2{color:#B58900}.light .ct-5a3490{color:#2AA198}.light .ct-e2e842{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-fc4738"},"children":[{"type":"text","value":"$cell: "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"250"}]},{"type":"element","tag":"span","props":{"class":"ct-500cf0"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc4738"},"children":[{"type":"text","value":"$gap: "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"20"}]},{"type":"element","tag":"span","props":{"class":"ct-500cf0"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-228947"},"children":[{"type":"text","value":".grid"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5bf74e"},"children":[{"type":"text","value":"display"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-99f92d"},"children":[{"type":"text","value":"grid"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5bf74e"},"children":[{"type":"text","value":"grid-template-columns"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-88ce24"},"children":[{"type":"text","value":"repeat"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-65bc06"},"children":[{"type":"text","value":"auto-fit"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-88ce24"},"children":[{"type":"text","value":"minmax"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-65bc06"},"children":[{"type":"text","value":"$cell"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-fadfc2"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-ab1c70"},"children":[{"type":"text","value":"fr"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-auto-rows"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"256"}]},{"type":"element","tag":"span","props":{"class":"ct-500cf0"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5bf74e"},"children":[{"type":"text","value":"grid-auto-flow"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-99f92d"},"children":[{"type":"text","value":"row"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-99f92d"},"children":[{"type":"text","value":"dense"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5bf74e"},"children":[{"type":"text","value":"grid-column-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65bc06"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5bf74e"},"children":[{"type":"text","value":"grid-row-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65bc06"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"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-228947"},"children":[{"type":"text","value":".h-2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7df285"},"children":[{"type":"text","value":"// takes 2 columns"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-column-end"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-228947"},"children":[{"type":"text","value":".v-2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7df285"},"children":[{"type":"text","value":"// takes 2 rows"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-row-end"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"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-228947"},"children":[{"type":"text","value":".full-width"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-500cf0"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-7df285"},"children":[{"type":"text","value":"// height: 1 row"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"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-228947"},"children":[{"type":"text","value":".top-right"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-500cf0"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-7df285"},"children":[{"type":"text","value":"// height here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"-2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-7df285"},"children":[{"type":"text","value":"// width here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7df285{color:#8B949E}.ct-6def5a{color:#79C0FF}.ct-ab1c70{color:#FF7B72}.ct-fadfc2{color:#79C0FF}.ct-65bc06{color:#FFA657}.ct-88ce24{color:#79C0FF}.ct-99f92d{color:#79C0FF}.ct-5bf74e{color:#79C0FF}.ct-4ca3c1{color:#C9D1D9}.ct-228947{color:#79C0FF}.ct-e26c6a{color:#C9D1D9}.ct-500cf0{color:#FF7B72}.ct-c77f9d{color:#79C0FF}.ct-fc4738{color:#FFA657}.light .ct-fc4738{color:#657B83}.light .ct-c77f9d{color:#D33682}.light .ct-500cf0{color:#859900}.light .ct-e26c6a{color:#657B83}.light .ct-228947{color:#93A1A1}.light .ct-4ca3c1{color:#657B83}.light .ct-5bf74e{color:#859900}.light .ct-99f92d{color:#657B83}.light .ct-88ce24{color:#268BD2}.light .ct-65bc06{color:#657B83}.light .ct-fadfc2{color:#D33682}.light .ct-ab1c70{color:#859900}.light .ct-6def5a{color:#859900}.light .ct-7df285{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-497b4c"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fad650"},"children":[{"type":"text","value":"color-per-child"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-497b4c"},"children":[{"type":"text","value":"@each"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-497b4c"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a97837"},"children":[{"type":"text","value":"&"}]},{"type":"element","tag":"span","props":{"class":"ct-7ee002"},"children":[{"type":"text","value":":nth-child"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"#{"}]},{"type":"element","tag":"span","props":{"class":"ct-2cb513"},"children":[{"type":"text","value":"index"}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"(($colors), ($color))}"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c42099"},"children":[{"type":"text","value":"color"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"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-85bf5a"},"children":[{"type":"text","value":".item"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0a2d2b"},"children":[{"type":"text","value":"@include"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d04bd4"},"children":[{"type":"text","value":"color_per_child"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-1605b9"},"children":[{"type":"text","value":"#ded187"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-1605b9"},"children":[{"type":"text","value":"#dbde87"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-1605b9"},"children":[{"type":"text","value":"#bade87"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-1605b9"},"children":[{"type":"text","value":"#9cde87"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-1605b9"},"children":[{"type":"text","value":"#87deaa"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1605b9{color:#79C0FF}.ct-d04bd4{color:#D2A8FF}.ct-0a2d2b{color:#FF7B72}.ct-85bf5a{color:#79C0FF}.ct-5a2e29{color:#C9D1D9}.ct-c42099{color:#79C0FF}.ct-2cb513{color:#79C0FF}.ct-7ee002{color:#79C0FF}.ct-a97837{color:#7EE787}.ct-e4cb31{color:#FFA657}.ct-fad650{color:#D2A8FF}.ct-ad1209{color:#C9D1D9}.ct-497b4c{color:#FF7B72}.light .ct-497b4c{color:#859900}.light .ct-ad1209{color:#657B83}.light .ct-fad650{color:#268BD2}.light .ct-e4cb31{color:#657B83}.light .ct-a97837{color:#268BD2}.light .ct-7ee002{color:#93A1A1}.light .ct-2cb513{color:#268BD2}.light .ct-c42099{color:#859900}.light .ct-5a2e29{color:#657B83}.light .ct-85bf5a{color:#93A1A1}.light .ct-0a2d2b{color:#859900}.light .ct-d04bd4{color:#268BD2}.light .ct-1605b9{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-52f331"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bb4c5e"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9a75fd"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-74b7be"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-52f331"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ede07a"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":": blur(5px);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"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-52f331"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-32e0cb"},"children":[{"type":"text","value":"can_backdrop"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-52f331"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-67fe3d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-b917d7"},"children":[{"type":"text","value":"-webkit-backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-67fe3d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-55cf6b"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-67fe3d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-29ab2f"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-a540fd"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-67fe3d"},"children":[{"type":"text","value":")) "}]},{"type":"element","tag":"span","props":{"class":"ct-f6c170"},"children":[{"type":"text","value":"or"}]},{"type":"element","tag":"span","props":{"class":"ct-67fe3d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bb4c5e"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9a75fd"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-74b7be"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-52f331"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-52f331"},"children":[{"type":"text","value":"@content"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f6c170{color:#79C0FF}.ct-a540fd{color:#FF7B72}.ct-29ab2f{color:#79C0FF}.ct-55cf6b{color:#79C0FF}.ct-b917d7{color:#79C0FF}.ct-67fe3d{color:#C9D1D9}.ct-32e0cb{color:#D2A8FF}.ct-ede07a{color:#7EE787}.ct-74b7be{color:#79C0FF}.ct-9a75fd{color:#79C0FF}.ct-bb4c5e{color:#79C0FF}.ct-a0156f{color:#C9D1D9}.ct-52f331{color:#FF7B72}.light .ct-52f331{color:#859900}.light .ct-a0156f{color:#657B83}.light .ct-bb4c5e{color:#859900}.light .ct-9a75fd{color:#268BD2}.light .ct-74b7be{color:#D33682}.light .ct-ede07a{color:#268BD2}.light .ct-32e0cb{color:#268BD2}.light .ct-67fe3d{color:#657B83}.light .ct-b917d7{color:#859900}.light .ct-55cf6b{color:#268BD2}.light .ct-29ab2f{color:#D33682}.light .ct-a540fd{color:#859900}.light .ct-f6c170{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-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-c28caa"},"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-c28caa"},"children":[{"type":"text","value":"// application/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"app"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-c28caa"},"children":[{"type":"text","value":"shared"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"shared"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"driver"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c28caa"},"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-c28caa"},"children":[{"type":"text","value":"/// mailserver/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"mail"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-c28caa"},"children":[{"type":"text","value":"\"application_shared\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"application_shared"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-54130b"},"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-54130b{color:#79C0FF}.ct-c28caa{color:#A5D6FF}.ct-67bcc4{color:#7EE787}.ct-adc987{color:#C9D1D9}.light .ct-adc987{color:#657B83}.light .ct-67bcc4{color:#268BD2}.light .ct-c28caa{color:#2AA198}.light .ct-54130b{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-9e0e5a"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-9e0e5a"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-9e0e5a"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"build-master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"plugins/docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"when"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"branch"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"dockerfile"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"Dockerfile"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"tag"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"${DRONE_BRANCH}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"global_docker_login"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"global_docker_password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"global_docker_registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"repo"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-9e0e5a"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-9e0e5a"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"drone"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"drone"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"drone/drone:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_RPC_SECRET=rpc_secret"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_SERVER_HOST=drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_SERVER_PROTO=https"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_TLS_AUTOCERT=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_GIT_ALWAYS_AUTH=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_LOGS_DEBUG=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_LOGS_TRACE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"./data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"8090:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"drone-agent"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"drone__agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"drone/agent:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-7970cc"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" DRONE_SERVER=https://drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7970cc"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" DRONE_TOKEN=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"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-84ac0e"},"children":[{"type":"text","value":"drone repo update "}]},{"type":"element","tag":"span","props":{"class":"ct-02d241"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0f697e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" --trusted=true "}]},{"type":"element","tag":"span","props":{"class":"ct-4462b4"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" drone repo info "}]},{"type":"element","tag":"span","props":{"class":"ct-02d241"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0f697e"},"children":[{"type":"text","value":"1"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-4462b4{color:#FF7B72}.ct-0f697e{color:#C9D1D9}.ct-02d241{color:#C9D1D9}.ct-7970cc{color:#FF7B72}.ct-fa36ad{color:#A5D6FF}.ct-84ac0e{color:#C9D1D9}.ct-9e0e5a{color:#7EE787}.light .ct-9e0e5a{color:#268BD2}.light .ct-84ac0e{color:#657B83}.light .ct-fa36ad{color:#2AA198}.light .ct-7970cc{color:#073642}.light .ct-02d241{color:#859900}.light .ct-0f697e{color:#268BD2}.light .ct-4462b4{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-e5c841"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"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-e5c841"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"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-e5c841"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"node:16"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"commands"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"yarn"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"yarn generate"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"rm -rf ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"mv ./.output/public ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"touch ./docs/.nojekyll"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"publish"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"plugins/gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"target_branch"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"github_username"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"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-6d06dc{color:#A5D6FF}.ct-ede346{color:#C9D1D9}.ct-e5c841{color:#7EE787}.light .ct-e5c841{color:#268BD2}.light .ct-ede346{color:#657B83}.light .ct-6d06dc{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-70f0f3"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" --entrypoint htpasswd registry:2 \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" -Bbn user mypassword "}]},{"type":"element","tag":"span","props":{"class":"ct-1380ba"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"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-e4a10d"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"docker__registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"registry:2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"5000:5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_AUTH=htpasswd"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_AUTH_HTPASSWD_REALM=Registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"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-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_HTTP_SECRET=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_STORAGE_DELETE_ENABLED=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"./registry/auth:/auth"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"./registry/data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"ui"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"docker__ui"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"parabuzzle/craneoperator:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"80:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_HOST=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_PORT=5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_PROTOCOL=http"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"ALLOW_REGISTRY_LOGIN=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_ALLOW_DELETE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"USERNAME=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"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-d1e433"},"children":[{"type":"text","value":"# Try this first"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" --rm anoxis/registry-cli \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" -r https://registry.url \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" -l user:password \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" --delete \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"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-d1e433"},"children":[{"type":"text","value":"# Then this "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":"docker run -it \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"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-70f0f3"},"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-70f0f3"},"children":[{"type":"text","value":" -e DRY_RUN="}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" -e REGISTRY_AUTH="}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"\"user:password\""}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" mortensrasmussen/docker-registry-manifest-cleanup"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-d1e433{color:#8B949E}.ct-65a7ad{color:#A5D6FF}.ct-e4a10d{color:#7EE787}.ct-1380ba{color:#FF7B72}.ct-70f0f3{color:#C9D1D9}.light .ct-70f0f3{color:#657B83}.light .ct-1380ba{color:#859900}.light .ct-e4a10d{color:#268BD2}.light .ct-65a7ad{color:#2AA198}.light .ct-d1e433{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-89fe6a"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"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-89fe6a"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"watchtower"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"children":[{"type":"text","value":"docker__watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"children":[{"type":"text","value":"v2tec/watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"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-4a670a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"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-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"children":[{"type":"text","value":"--interval 60 image_1 image_2"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-520d15{color:#A5D6FF}.ct-4a670a{color:#C9D1D9}.ct-89fe6a{color:#7EE787}.light .ct-89fe6a{color:#268BD2}.light .ct-4a670a{color:#657B83}.light .ct-520d15{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-940413"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-940413"},"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-940413"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":"DUMP_PATH="}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":"CONTAINER="}]},{"type":"element","tag":"span","props":{"class":"ct-d23d5b"},"children":[{"type":"text","value":"\"db\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":"USER=root"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":"PASSWORD=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-022775"},"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-022775"},"children":[{"type":"text","value":"cat "}]},{"type":"element","tag":"span","props":{"class":"ct-d23d5b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"DUMP_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-d23d5b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8bc246"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-f598d7"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" -i "}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"CONTAINER"}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" mysql -u"}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" -p"}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"DB"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f598d7{color:#79C0FF}.ct-8bc246{color:#FF7B72}.ct-d23d5b{color:#A5D6FF}.ct-25717c{color:#C9D1D9}.ct-6bc133{color:#C9D1D9}.ct-022775{color:#C9D1D9}.ct-940413{color:#8B949E}.light .ct-940413{color:#93A1A1}.light .ct-022775{color:#657B83}.light .ct-6bc133{color:#859900}.light .ct-25717c{color:#268BD2}.light .ct-d23d5b{color:#2AA198}.light .ct-8bc246{color:#859900}.light .ct-f598d7{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-2861e4"},"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-7bd70d"},"children":[{"type":"text","value":"wait_for_mysql"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" query="}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\"SELECT count(*) FROM users\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-2861e4"},"children":[{"type":"text","value":"# 3 minutes limit"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-22d5e9"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" mysql --user="}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" -e "}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-5fb5de"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22d5e9"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\"[Error] can't properly query MySQL after "}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22d5e9"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2861e4"},"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-5fb5de{color:#79C0FF}.ct-51718e{color:#C9D1D9}.ct-5771f3{color:#C9D1D9}.ct-22d5e9{color:#79C0FF}.ct-afea19{color:#FF7B72}.ct-4bc028{color:#A5D6FF}.ct-0bb3f2{color:#C9D1D9}.ct-7bd70d{color:#D2A8FF}.ct-2861e4{color:#8B949E}.light .ct-2861e4{color:#93A1A1}.light .ct-7bd70d{color:#268BD2}.light .ct-0bb3f2{color:#657B83}.light .ct-4bc028{color:#2AA198}.light .ct-afea19{color:#859900}.light .ct-22d5e9{color:#268BD2}.light .ct-5771f3{color:#859900}.light .ct-51718e{color:#268BD2}.light .ct-5fb5de{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-b43981"},"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-0b0467"},"children":[{"type":"text","value":"wait_for_redis"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-b43981"},"children":[{"type":"text","value":"# 3 minutes"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-c8e976"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" redis-cli -h localhost -p 6379 -a "}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" ping "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\"PONG\""}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":"/dev/null "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"2>&1;"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-e756ed"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8e976"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\"[Error] can't properly ping Redis container after "}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8e976"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b43981"},"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-e756ed{color:#79C0FF}.ct-cf12d8{color:#C9D1D9}.ct-81100c{color:#C9D1D9}.ct-622801{color:#A5D6FF}.ct-c8e976{color:#79C0FF}.ct-5f7377{color:#FF7B72}.ct-c2b3a4{color:#C9D1D9}.ct-0b0467{color:#D2A8FF}.ct-b43981{color:#8B949E}.light .ct-b43981{color:#93A1A1}.light .ct-0b0467{color:#268BD2}.light .ct-c2b3a4{color:#657B83}.light .ct-5f7377{color:#859900}.light .ct-c8e976{color:#268BD2}.light .ct-622801{color:#2AA198}.light .ct-81100c{color:#859900}.light .ct-cf12d8{color:#268BD2}.light .ct-e756ed{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-536cc9"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-f689ea"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'react-native-app-auth'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-053d0a"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f15ee2"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" issuer: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'https://accounts.google.com'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}.apps.googleusercontent.com`"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"`com.yourapp:/oauth2redirect/google`"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'openid'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'profile'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-feeeca"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"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-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-053d0a"},"children":[{"type":"text","value":"// better hide it somehow"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'com.yourapp'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f15ee2"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" serviceConfiguration: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" authorizationEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/authorize?response_type=code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}&redirect_uri=${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-053d0a"},"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-f8be4b"},"children":[{"type":"text","value":" tokenEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}&client_secret=${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'login:info'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'login:avatar'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-feeeca"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f15ee2"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f689ea"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-f689ea"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"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-feeeca{color:#79C0FF}.ct-f15ee2{color:#D2A8FF}.ct-053d0a{color:#8B949E}.ct-bfd1f5{color:#79C0FF}.ct-b9865f{color:#FF7B72}.ct-d5282b{color:#A5D6FF}.ct-f689ea{color:#C9D1D9}.ct-f8be4b{color:#C9D1D9}.ct-536cc9{color:#FF7B72}.light .ct-536cc9{color:#859900}.light .ct-f8be4b{color:#657B83}.light .ct-f689ea{color:#268BD2}.light .ct-d5282b{color:#2AA198}.light .ct-b9865f{color:#073642}.light .ct-bfd1f5{color:#268BD2}.light .ct-053d0a{color:#93A1A1}.light .ct-f15ee2{color:#268BD2}.light .ct-feeeca{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-c2fc37"},"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-6c2848"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f50258"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ab0ca"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"; }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-76f488"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-81f833"},"children":[{"type":"text","value":"SomeList"}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c154ca"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-c154ca"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" ({ "}]},{"type":"element","tag":"span","props":{"class":"ct-0e6a97"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-76f488"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-61c35b"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-61c35b"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2fc37"},"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-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-31f9cf"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0e6a97"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c154ca"},"children":[{"type":"text","value":"NativeSyntheticEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-c154ca"},"children":[{"type":"text","value":"NativeScrollEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":">) "}]},{"type":"element","tag":"span","props":{"class":"ct-76f488"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"nativeEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"contentOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"y"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-76f488"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8916ca"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-81f833"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-0e6a97"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dc23db"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0e6a97"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dc23db"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-76f488"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"scrollToOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" offset: "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" animated: "}]},{"type":"element","tag":"span","props":{"class":"ct-31f9cf"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2fc37"},"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-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"onInteraction"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-31f9cf"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-61c35b"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-31f9cf"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-61c35b"},"children":[{"type":"text","value":"500"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"setSelectedSubThemes"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-ffb015"},"children":[{"type":"text","value":"FlatList"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2fc37"},"children":[{"type":"text","value":"// ...required FlatList options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"/>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ffb015{color:#FFA657}.ct-dc23db{color:#79C0FF}.ct-8916ca{color:#79C0FF}.ct-a011f1{color:#C9D1D9}.ct-31f9cf{color:#79C0FF}.ct-61c35b{color:#79C0FF}.ct-f0e24c{color:#79C0FF}.ct-0e6a97{color:#FFA657}.ct-c154ca{color:#FFA657}.ct-645c1b{color:#FF7B72}.ct-81f833{color:#D2A8FF}.ct-1cc538{color:#C9D1D9}.ct-76f488{color:#FF7B72}.ct-1ab0ca{color:#79C0FF}.ct-642fdb{color:#D2A8FF}.ct-0cf5ac{color:#FF7B72}.ct-f50258{color:#FFA657}.ct-8bf940{color:#C9D1D9}.ct-6c2848{color:#FF7B72}.ct-c2fc37{color:#8B949E}.light .ct-c2fc37{color:#93A1A1}.light .ct-6c2848{color:#073642}.light .ct-8bf940{color:#657B83}.light .ct-f50258{color:#268BD2}.light .ct-0cf5ac{color:#859900}.light .ct-642fdb{color:#268BD2}.light .ct-1ab0ca{color:#859900}.light .ct-76f488{color:#073642}.light .ct-1cc538{color:#657B83}.light .ct-81f833{color:#268BD2}.light .ct-645c1b{color:#859900}.light .ct-c154ca{color:#268BD2}.light .ct-0e6a97{color:#657B83}.light .ct-f0e24c{color:#268BD2}.light .ct-61c35b{color:#D33682}.light .ct-31f9cf{color:#B58900}.light .ct-a011f1{color:#268BD2}.light .ct-8916ca{color:#268BD2}.light .ct-dc23db{color:#859900}.light .ct-ffb015{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-1350ad"},"children":[{"type":"text","value":"adb logcat com.application:I "}]},{"type":"element","tag":"span","props":{"class":"ct-65c5ba"},"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-1350ad"},"children":[{"type":"text","value":"keytool -printcert -jarfile "}]},{"type":"element","tag":"span","props":{"class":"ct-65c5ba"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-a8ce39"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-fa8b86"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-65c5ba"},"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-1350ad"},"children":[{"type":"text","value":"npx react-native bundle \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" --platform android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" --dev "}]},{"type":"element","tag":"span","props":{"class":"ct-9b5163"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" --entry-file index.js \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"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-1350ad"},"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-9b5163"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" android "}]},{"type":"element","tag":"span","props":{"class":"ct-369f62"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"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-cb124c"},"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-1350ad"},"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-9b5163"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" ./android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-369f62"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" ./gradlew assembleRelease \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-369f62"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"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-cb124c"},"children":[{"type":"text","value":"# ios "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":"xcrun simctl openurl booted "}]},{"type":"element","tag":"span","props":{"class":"ct-a8ce39"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-fa8b86"},"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-cb124c"},"children":[{"type":"text","value":"# android"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":"adb shell am start -W -a android.intent.action.VIEW -d "}]},{"type":"element","tag":"span","props":{"class":"ct-a8ce39"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-fa8b86"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"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-1350ad"},"children":[{"type":"text","value":"PACKAGE="}]},{"type":"element","tag":"span","props":{"class":"ct-65c5ba"},"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-1350ad"},"children":[{"type":"text","value":"adb shell pm set-app-links --package "}]},{"type":"element","tag":"span","props":{"class":"ct-a8ce39"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-fa8b86"},"children":[{"type":"text","value":"PACKAGE"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" 0 all "}]},{"type":"element","tag":"span","props":{"class":"ct-369f62"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" adb shell pm verify-app-links --re-verify "}]},{"type":"element","tag":"span","props":{"class":"ct-a8ce39"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-fa8b86"},"children":[{"type":"text","value":"PACKAGE"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-cb124c{color:#8B949E}.ct-369f62{color:#FF7B72}.ct-9b5163{color:#79C0FF}.ct-fa8b86{color:#C9D1D9}.ct-a8ce39{color:#C9D1D9}.ct-65c5ba{color:#A5D6FF}.ct-1350ad{color:#C9D1D9}.light .ct-1350ad{color:#657B83}.light .ct-65c5ba{color:#2AA198}.light .ct-a8ce39{color:#859900}.light .ct-fa8b86{color:#268BD2}.light .ct-9b5163{color:#268BD2}.light .ct-369f62{color:#859900}.light .ct-cb124c{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-bf76e7"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"\"axios\""}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"React"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50afea"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d3e13b"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-e7668c"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-e7668c"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4ca53d"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-e7668c"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4ca53d"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90d7a6"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" client: "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f099ac"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-f099ac"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" )."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"<() "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90d7a6"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":">(() "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5aedf5"},"children":[{"type":"text","value":"// TODO: implement me"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90d7a6"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"\"not implemented\""}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5aedf5"},"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-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"`Bearer ${"}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-0deb7f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90d7a6"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5aedf5"},"children":[{"type":"text","value":"// refreshing interceptor"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b58b07"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8e7f4"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"\"Bearer \""}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90d7a6"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"Provider"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"{{ "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }}"}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":">"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"useAPI"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-a8e7f4{color:#79C0FF}.ct-b58b07{color:#79C0FF}.ct-0deb7f{color:#A5D6FF}.ct-5aedf5{color:#8B949E}.ct-f099ac{color:#FFA657}.ct-1950bd{color:#79C0FF}.ct-90d7a6{color:#79C0FF}.ct-3d65cb{color:#FF7B72}.ct-a482ec{color:#D2A8FF}.ct-4ca53d{color:#79C0FF}.ct-e7668c{color:#FF7B72}.ct-0f7fe5{color:#FFA657}.ct-d3e13b{color:#79C0FF}.ct-50afea{color:#FFA657}.ct-64168b{color:#C9D1D9}.ct-37e1cc{color:#FF7B72}.ct-90c8db{color:#A5D6FF}.ct-e779cf{color:#C9D1D9}.ct-ed570f{color:#C9D1D9}.ct-bf76e7{color:#FF7B72}.light .ct-bf76e7{color:#859900}.light .ct-ed570f{color:#657B83}.light .ct-e779cf{color:#268BD2}.light .ct-90c8db{color:#2AA198}.light .ct-37e1cc{color:#073642}.light .ct-64168b{color:#657B83}.light .ct-50afea{color:#268BD2}.light .ct-d3e13b{color:#657B83}.light .ct-0f7fe5{color:#657B83}.light .ct-e7668c{color:#859900}.light .ct-4ca53d{color:#859900}.light .ct-a482ec{color:#268BD2}.light .ct-3d65cb{color:#073642}.light .ct-90d7a6{color:#859900}.light .ct-1950bd{color:#268BD2}.light .ct-f099ac{color:#268BD2}.light .ct-5aedf5{color:#93A1A1}.light .ct-0deb7f{color:#657B83}.light .ct-b58b07{color:#D33682}.light .ct-a8e7f4{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-842e6b"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a29"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a29"},"children":[{"type":"text","value":"'axios'"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ea340"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"useGetUsers"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ea340"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"());"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ea340"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ea340"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b24a29"},"children":[{"type":"text","value":"\"/\""}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24840b"},"children":[{"type":"text","value":"// params and props here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" signal: "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"signal"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ea340"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"abort"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24840b"},"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-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-24840b{color:#8B949E}.ct-d15e84{color:#D2A8FF}.ct-2ea340{color:#79C0FF}.ct-a500ef{color:#FF7B72}.ct-b24a29{color:#A5D6FF}.ct-c3b3b5{color:#C9D1D9}.ct-823297{color:#C9D1D9}.ct-842e6b{color:#FF7B72}.light .ct-842e6b{color:#859900}.light .ct-823297{color:#657B83}.light .ct-c3b3b5{color:#268BD2}.light .ct-b24a29{color:#2AA198}.light .ct-a500ef{color:#073642}.light .ct-2ea340{color:#268BD2}.light .ct-d15e84{color:#268BD2}.light .ct-24840b{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-50be53"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2256ee"},"children":[{"type":"text","value":"'react'"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71d755"},"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-71d755"},"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-71d755"},"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-71d755"},"children":[{"type":"text","value":" */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10d630"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64a834"},"children":[{"type":"text","value":"useWhatsChanged"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-072d13"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-6b4fe7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d81651"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-f51b9a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f51b9a"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":">,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2256ee"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-10d630"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10d630"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ebf9df"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64a834"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64a834"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-10d630"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f51b9a"},"children":[{"type":"text","value":"Object"}]},{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6ba254"},"children":[{"type":"text","value":"entries"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"value"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-64a834"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2256ee"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-2256ee"},"children":[{"type":"text","value":"} ${"}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-2256ee"},"children":[{"type":"text","value":"} has changed`"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-6ba254{color:#D2A8FF}.ct-ebf9df{color:#79C0FF}.ct-f51b9a{color:#79C0FF}.ct-d81651{color:#FFA657}.ct-6b4fe7{color:#FF7B72}.ct-072d13{color:#FFA657}.ct-c40951{color:#C9D1D9}.ct-64a834{color:#D2A8FF}.ct-10d630{color:#FF7B72}.ct-71d755{color:#8B949E}.ct-2256ee{color:#A5D6FF}.ct-c2aa86{color:#C9D1D9}.ct-957903{color:#C9D1D9}.ct-50be53{color:#FF7B72}.light .ct-50be53{color:#859900}.light .ct-957903{color:#657B83}.light .ct-c2aa86{color:#268BD2}.light .ct-2256ee{color:#2AA198}.light .ct-71d755{color:#93A1A1}.light .ct-10d630{color:#073642}.light .ct-64a834{color:#268BD2}.light .ct-c40951{color:#657B83}.light .ct-072d13{color:#657B83}.light .ct-6b4fe7{color:#859900}.light .ct-d81651{color:#268BD2}.light .ct-f51b9a{color:#859900}.light .ct-ebf9df{color:#268BD2}.light .ct-6ba254{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-d0cc10"},"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-d7619b"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-df759b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d7619b"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8311bd"},"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-bee573"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bee573"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8311bd"},"children":[{"type":"text","value":"'vue'"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bee573"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fc1c1f"},"children":[{"type":"text","value":"ComponentCustomProperties"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8273bb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-17e750"},"children":[{"type":"text","value":"$translate"}]},{"type":"element","tag":"span","props":{"class":"ct-42aed1"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-8273bb"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-72e938"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-42aed1"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-8273bb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4fa542"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-8273bb"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e809ed"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-8273bb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4fa542"},"children":[{"type":"text","value":"string"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e809ed{color:#FF7B72}.ct-4fa542{color:#79C0FF}.ct-72e938{color:#FFA657}.ct-42aed1{color:#FF7B72}.ct-17e750{color:#D2A8FF}.ct-8273bb{color:#C9D1D9}.ct-fc1c1f{color:#FFA657}.ct-bee573{color:#FF7B72}.ct-8311bd{color:#A5D6FF}.ct-df759b{color:#C9D1D9}.ct-be2779{color:#C9D1D9}.ct-d7619b{color:#FF7B72}.ct-d0cc10{color:#8B949E}.light .ct-d0cc10{color:#93A1A1}.light .ct-d7619b{color:#859900}.light .ct-be2779{color:#657B83}.light .ct-df759b{color:#268BD2}.light .ct-8311bd{color:#2AA198}.light .ct-bee573{color:#073642}.light .ct-fc1c1f{color:#268BD2}.light .ct-8273bb{color:#657B83}.light .ct-17e750{color:#268BD2}.light .ct-42aed1{color:#859900}.light .ct-72e938{color:#657B83}.light .ct-4fa542{color:#859900}.light .ct-e809ed{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-40e415"},"children":[{"type":"text","value":"// ~/server/plugins/highlight.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7fd0e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-55c159"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c7fd0e"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-55c159"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c7968a"},"children":[{"type":"text","value":"defineNitroPlugin"}]},{"type":"element","tag":"span","props":{"class":"ct-55c159"},"children":[{"type":"text","value":"((nitroApp) "}]},{"type":"element","tag":"span","props":{"class":"ct-42c01b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-55c159"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64c7a9"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"nitroApp"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"hooks"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a60195"},"children":[{"type":"text","value":"hook"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-230bb4"},"children":[{"type":"text","value":"\"content:file:beforeParse\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0dabf1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"_id"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a60195"},"children":[{"type":"text","value":"endsWith"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-230bb4"},"children":[{"type":"text","value":"\".md\""}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0dabf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a60195"},"children":[{"type":"text","value":"replace"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7ba0"},"children":[{"type":"text","value":"/==("}]},{"type":"element","tag":"span","props":{"class":"ct-8e90cf"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-0dabf1"},"children":[{"type":"text","value":"^"}]},{"type":"element","tag":"span","props":{"class":"ct-8e90cf"},"children":[{"type":"text","value":"=]"}]},{"type":"element","tag":"span","props":{"class":"ct-0dabf1"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-5f7ba0"},"children":[{"type":"text","value":")==/"}]},{"type":"element","tag":"span","props":{"class":"ct-0dabf1"},"children":[{"type":"text","value":"gs"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-230bb4"},"children":[{"type":"text","value":"`$1`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64c7a9"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-55c159"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-64c7a9"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-8e90cf{color:#79C0FF}.ct-5f7ba0{color:#A5D6FF}.ct-0dabf1{color:#FF7B72}.ct-230bb4{color:#A5D6FF}.ct-a60195{color:#D2A8FF}.ct-f6d93e{color:#C9D1D9}.ct-f86631{color:#C9D1D9}.ct-64c7a9{color:#C9D1D9}.ct-42c01b{color:#FF7B72}.ct-c7968a{color:#D2A8FF}.ct-55c159{color:#FFA657}.ct-c7fd0e{color:#FF7B72}.ct-40e415{color:#8B949E}.light .ct-40e415{color:#93A1A1}.light .ct-c7fd0e{color:#859900}.light .ct-55c159{color:#657B83}.light .ct-c7968a{color:#268BD2}.light .ct-42c01b{color:#073642}.light .ct-64c7a9{color:#657B83}.light .ct-f86631{color:#657B83}.light .ct-f6d93e{color:#268BD2}.light .ct-a60195{color:#268BD2}.light .ct-230bb4{color:#2AA198}.light .ct-0dabf1{color:#859900}.light .ct-5f7ba0{color:#D30102}.light .ct-8e90cf{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-f70778"},"children":[{"type":"text","value":"// render-a-cube.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"./create-shader\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"./vertex.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"./fragment.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getElementyId"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getRenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"'webgl'"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// should be put inside requestAnimationFrame"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":")(); "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0aa98"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa7a76"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa7a76"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// Initializing viewport"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf159c"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"Can't init programm\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"VERTEX_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"FRAGMENT_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"linkProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getProgramParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"LINK_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf159c"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"Could not initialise shaders\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 3"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 4"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 5"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 7"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// side 0 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// side 0 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// side 1 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// side 1 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf159c"},"children":[{"type":"text","value":"Float32Array"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"STATIC_DRAW"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7def95"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf159c"},"children":[{"type":"text","value":"Uint16Array"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"STATIC_DRAW"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7def95"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// initial drawing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"enable"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"DEPTH_TEST"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"DEPTH_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vertexAttribPointer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"), "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 3 bytes-long"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"FLOAT"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7def95"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"enableVertexAttribArray"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0.01"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"useProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0.25"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"slide\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"aspect\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"squareIndexBuffer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"drawElements"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"TRIANGLES"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"indices"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"UNSIGNED_SHORT"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"+="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"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-f70778"},"children":[{"type":"text","value":"// create-shader.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0aa98"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa7a76"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa7a76"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f8eec0"},"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-37d28d"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf159c"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"`Can't init shader`"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"shaderSource"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"compileShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getShaderParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"COMPILE_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getShaderInfoLog"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"`Could not compile WebGL program. "}]},{"type":"element","tag":"span","props":{"class":"ct-ab3506"},"children":[{"type":"text","value":"\\n\\n"}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"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-f70778"},"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-37d28d"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-f70778"},"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-37d28d"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"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-9662c5"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"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-37d28d"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"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-9662c5"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ab3506{color:#79C0FF}.ct-f8eec0{color:#8B949E}.ct-7def95{color:#79C0FF}.ct-cf159c{color:#79C0FF}.ct-67a764{color:#79C0FF}.ct-fa7a76{color:#79C0FF}.ct-b0aa98{color:#FFA657}.ct-5860fb{color:#FF7B72}.ct-829027{color:#FFA657}.ct-32680c{color:#C9D1D9}.ct-48b53b{color:#D2A8FF}.ct-24c8e4{color:#79C0FF}.ct-9662c5{color:#FF7B72}.ct-f78144{color:#A5D6FF}.ct-e05c75{color:#C9D1D9}.ct-37d28d{color:#C9D1D9}.ct-6df26c{color:#FF7B72}.ct-f70778{color:#8B949E}.light .ct-f70778{color:#93A1A1}.light .ct-6df26c{color:#859900}.light .ct-37d28d{color:#657B83}.light .ct-e05c75{color:#268BD2}.light .ct-f78144{color:#2AA198}.light .ct-9662c5{color:#073642}.light .ct-24c8e4{color:#268BD2}.light .ct-48b53b{color:#268BD2}.light .ct-32680c{color:#657B83}.light .ct-829027{color:#657B83}.light .ct-5860fb{color:#859900}.light .ct-b0aa98{color:#268BD2}.light .ct-fa7a76{color:#859900}.light .ct-67a764{color:#D33682}.light .ct-cf159c{color:#859900}.light .ct-7def95{color:#B58900}.light .ct-f8eec0{color:#93A1A1}.light .ct-ab3506{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-cc550d"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-3d2392"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-3d2392"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-3d2392"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"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-3d2392"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-17c231"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3d2392"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"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-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-3da093"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-17c231"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f2f3e"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-3f2f3e"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-3a2134"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"}```"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-3a2134{color:#79C0FF}.ct-3f2f3e{color:#C9D1D9}.ct-3da093{color:#FF7B72}.ct-17c231{color:#D2A8FF}.ct-839dd2{color:#8B949E}.ct-3d2392{color:#FF7B72}.ct-cc550d{color:#C9D1D9}.light .ct-cc550d{color:#657B83}.light .ct-3d2392{color:#073642}.light .ct-839dd2{color:#93A1A1}.light .ct-17c231{color:#268BD2}.light .ct-3da093{color:#859900}.light .ct-3f2f3e{color:#268BD2}.light .ct-3a2134{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-c8bb8b"},"children":[{"type":"text","value":"// main.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"Worker"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"'./render-worker.ts'"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"getElementById"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"children":[{"type":"text","value":"// attaching event listener to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04469e"},"children":[{"type":"text","value":"MessageEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af4150"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04469e"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ca9152"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ca9152"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"children":[{"type":"text","value":"// sending canvas contents to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"renderInCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"] })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"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-c8bb8b"},"children":[{"type":"text","value":"// render-worker.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b7e1"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-6a09b8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2b7e1"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-6a09b8"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-2b5817"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-6a09b8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-60d6c0"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"message"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"instanceof"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04469e"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af4150"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"'Received unknown data'"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"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-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"OffscreenCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af4150"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ca9152"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ca9152"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"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-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"children":[{"type":"text","value":"// a couple of seconds"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"doHardRenderingStuffHere"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"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-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"] });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-60d6c0{color:#C9D1D9}.ct-2b5817{color:#FF7B72}.ct-6a09b8{color:#FFA657}.ct-c2b7e1{color:#FF7B72}.ct-ca9152{color:#79C0FF}.ct-af4150{color:#79C0FF}.ct-04469e{color:#FFA657}.ct-bf026d{color:#C9D1D9}.ct-c639cc{color:#A5D6FF}.ct-333c44{color:#D2A8FF}.ct-4f1418{color:#FF7B72}.ct-5dc610{color:#79C0FF}.ct-560b2d{color:#C9D1D9}.ct-2a6009{color:#FF7B72}.ct-c8bb8b{color:#8B949E}.light .ct-c8bb8b{color:#93A1A1}.light .ct-2a6009{color:#073642}.light .ct-560b2d{color:#657B83}.light .ct-5dc610{color:#268BD2}.light .ct-4f1418{color:#859900}.light .ct-333c44{color:#268BD2}.light .ct-c639cc{color:#2AA198}.light .ct-bf026d{color:#268BD2}.light .ct-04469e{color:#268BD2}.light .ct-af4150{color:#859900}.light .ct-ca9152{color:#D33682}.light .ct-c2b7e1{color:#859900}.light .ct-6a09b8{color:#657B83}.light .ct-2b5817{color:#073642}.light .ct-60d6c0{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-8699d9"},"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-e798c2"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"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-8699d9"},"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-e798c2"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-218838"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-218838"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"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-218838"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"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-e798c2"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"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-e798c2"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"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-e798c2"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"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-e798c2"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"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-80c375{color:#79C0FF}.ct-06584e{color:#FF7B72}.ct-638145{color:#D2A8FF}.ct-218838{color:#FF7B72}.ct-e798c2{color:#C9D1D9}.ct-8699d9{color:#8B949E}.light .ct-8699d9{color:#93A1A1}.light .ct-e798c2{color:#657B83}.light .ct-218838{color:#073642}.light .ct-638145{color:#268BD2}.light .ct-06584e{color:#859900}.light .ct-80c375{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-497f82"},"children":[{"type":"text","value":"[url "}]},{"type":"element","tag":"span","props":{"class":"ct-d4cc90"},"children":[{"type":"text","value":"\"https://github.com\""}]},{"type":"element","tag":"span","props":{"class":"ct-497f82"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-497f82"},"children":[{"type":"text","value":" insteadOf "}]},{"type":"element","tag":"span","props":{"class":"ct-4318f3"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-497f82"},"children":[{"type":"text","value":" git:"}]},{"type":"element","tag":"span","props":{"class":"ct-3e3bdd"},"children":[{"type":"text","value":"//github.com"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-3e3bdd{color:#8B949E}.ct-4318f3{color:#FF7B72}.ct-d4cc90{color:#A5D6FF}.ct-497f82{color:#C9D1D9}.light .ct-497f82{color:#657B83}.light .ct-d4cc90{color:#2AA198}.light .ct-4318f3{color:#859900}.light .ct-3e3bdd{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-c2656d"},"children":[{"type":"text","value":"[alias]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" flush "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" git clean"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"branches branch "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"v master "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" xargs git branch "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"D"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" lol "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" log "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"oneline "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"graph"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" l "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" lol"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" c "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" cv "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"no"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"verify "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" push"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" pf "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"force"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"with"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"lease"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" ignore"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"now "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" update"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"index "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"skip"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"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-108367{color:#FF7B72}.ct-c2656d{color:#C9D1D9}.light .ct-c2656d{color:#657B83}.light .ct-108367{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-3137ef"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-42ebd0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-36c520"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-fa149d"},"children":[{"type":"text","value":"golang.org/x/text/language"}]},{"type":"element","tag":"span","props":{"class":"ct-36c520"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-42ebd0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-36c520"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-fa149d"},"children":[{"type":"text","value":"golang.org/x/text/message"}]},{"type":"element","tag":"span","props":{"class":"ct-36c520"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-944454"},"children":[{"type":"text","value":"lang"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3137ef"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" language."}]},{"type":"element","tag":"span","props":{"class":"ct-3ac2c4"},"children":[{"type":"text","value":"MustParse"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-54c85a"},"children":[{"type":"text","value":"ru-RU"}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-944454"},"children":[{"type":"text","value":"printer"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3137ef"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" message."}]},{"type":"element","tag":"span","props":{"class":"ct-3ac2c4"},"children":[{"type":"text","value":"NewPrinter"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"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-944454"},"children":[{"type":"text","value":"count"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3137ef"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-818c23"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":"printer."}]},{"type":"element","tag":"span","props":{"class":"ct-3ac2c4"},"children":[{"type":"text","value":"Sprintf"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-be627a"},"children":[{"type":"text","value":"%d"}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":" butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"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-44b132"},"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-44b132"},"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-44b132"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"message\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"translation\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"select\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"feature\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"plural\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"arg\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"cases\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"one\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} бабочка\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"few\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} бабочки\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"many\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} бабочек\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"other\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} бабочуль\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"placeholders\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"string\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"%[1]d\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"type\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"underlyingType\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"argNum\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-818c23"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"expr\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"count\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"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-d9dfad"},"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-44b132"},"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-d9dfad{color:#8B949E}.ct-f35525{color:#79C0FF}.ct-be627a{color:#79C0FF}.ct-818c23{color:#79C0FF}.ct-54c85a{color:#FFA198}.ct-3cfa3f{color:#A5D6FF}.ct-3ac2c4{color:#79C0FF}.ct-944454{color:#C9D1D9}.ct-fa149d{color:#FFA657}.ct-36c520{color:#A5D6FF}.ct-42ebd0{color:#C9D1D9}.ct-44b132{color:#C9D1D9}.ct-3137ef{color:#FF7B72}.light .ct-3137ef{color:#859900}.light .ct-44b132{color:#657B83}.light .ct-42ebd0{color:#657B83}.light .ct-36c520{color:#2AA198}.light .ct-fa149d{color:#2AA198}.light .ct-944454{color:#268BD2}.light .ct-3ac2c4{color:#268BD2}.light .ct-3cfa3f{color:#2AA198}.light .ct-54c85a{color:#CD3131}.light .ct-818c23{color:#D33682}.light .ct-be627a{color:#CB4B16}.light .ct-f35525{color:#859900}.light .ct-d9dfad{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-a8abaf"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30ee11"},"children":[{"type":"text","value":"listItems"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"filter"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"sort"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"limit"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"): "}]},{"type":"element","tag":"span","props":{"class":"ct-30ee11"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"input"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4281e"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4281e"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": ["}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"Item"}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"Int"}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"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-a8abaf"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8211dc"},"children":[{"type":"text","value":"'@apollo/client'"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-302f13"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2310f1"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30ee11"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" cache: "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30ee11"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"({ "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-302f13"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2310f1"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9e1a3"},"children":[{"type":"text","value":"TypePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" Query: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" fields: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// query name"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" listItems: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"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-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"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-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// consider choosing the right fields, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"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-684206"},"children":[{"type":"text","value":" keyArgs: ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8211dc"},"children":[{"type":"text","value":"'sort'"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// primitive type"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8211dc"},"children":[{"type":"text","value":"'filter'"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":", ["}]},{"type":"element","tag":"span","props":{"class":"ct-8211dc"},"children":[{"type":"text","value":"'name'"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-8211dc"},"children":[{"type":"text","value":"'type'"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// nested fields of `filter`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" ],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" merge: "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"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-42c786"},"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-186acb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3ad0bb"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-186acb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// no existing data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"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-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// merge cache and incoming data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-302f13"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2310f1"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// apply latest result for totalCount"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-302f13"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2310f1"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-3ad0bb{color:#D2A8FF}.ct-186acb{color:#FF7B72}.ct-e9e1a3{color:#FFA657}.ct-42c786{color:#8B949E}.ct-2310f1{color:#79C0FF}.ct-302f13{color:#FF7B72}.ct-8211dc{color:#A5D6FF}.ct-5893ae{color:#C9D1D9}.ct-c1dd0b{color:#FF7B72}.ct-c4281e{color:#79C0FF}.ct-c7858e{color:#79C0FF}.ct-450d23{color:#FFA657}.ct-91b1ff{color:#C9D1D9}.ct-30ee11{color:#D2A8FF}.ct-684206{color:#C9D1D9}.ct-a8abaf{color:#FF7B72}.light .ct-a8abaf{color:#859900}.light .ct-684206{color:#657B83}.light .ct-30ee11{color:#268BD2}.light .ct-91b1ff{color:#657B83}.light .ct-450d23{color:#657B83}.light .ct-c7858e{color:#859900}.light .ct-c4281e{color:#859900}.light .ct-c1dd0b{color:#859900}.light .ct-5893ae{color:#268BD2}.light .ct-8211dc{color:#2AA198}.light .ct-302f13{color:#073642}.light .ct-2310f1{color:#268BD2}.light .ct-42c786{color:#93A1A1}.light .ct-e9e1a3{color:#268BD2}.light .ct-186acb{color:#073642}.light .ct-3ad0bb{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-dfa5ff"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"createApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"authorization"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e6fdf9"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"<"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" >,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"ApolloClientBase"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" link: "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"ApolloLink"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"(["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"setContext"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"HttpLink"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" uri: "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" fetch: "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ]),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"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-447e6a"},"children":[{"type":"text","value":"/** Global singleton for refreshing promise */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e6fdf9"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-e3665f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"<{ "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"ErrorCode"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" }>)"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"isArray"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"some"}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f0c5e"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"children":[{"type":"text","value":"// Distinguish unauthorized error here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-e3665f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0129f6"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"operationName"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e31246"},"children":[{"type":"text","value":"'RefreshToken'"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-dfa5ff"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0129f6"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" { accessToken: "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ) "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"Response"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e6fdf9"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":">)?."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0129f6"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e31246"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"async"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0129f6"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0129f6"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ok: "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e31246"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e31246"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-e31246"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e31246{color:#A5D6FF}.ct-0129f6{color:#79C0FF}.ct-8f0c5e{color:#79C0FF}.ct-950799{color:#FFA657}.ct-0864e2{color:#79C0FF}.ct-04ec2d{color:#C9D1D9}.ct-447e6a{color:#8B949E}.ct-e6fdf9{color:#FFA657}.ct-e3665f{color:#FF7B72}.ct-d5c40d{color:#D2A8FF}.ct-fea037{color:#79C0FF}.ct-e29465{color:#79C0FF}.ct-9870c8{color:#FF7B72}.ct-bce9e7{color:#FFA657}.ct-440b61{color:#C9D1D9}.ct-27d781{color:#D2A8FF}.ct-9aa602{color:#FF7B72}.ct-741a35{color:#C9D1D9}.ct-dfa5ff{color:#FF7B72}.light .ct-dfa5ff{color:#859900}.light .ct-741a35{color:#657B83}.light .ct-9aa602{color:#073642}.light .ct-27d781{color:#268BD2}.light .ct-440b61{color:#657B83}.light .ct-bce9e7{color:#657B83}.light .ct-9870c8{color:#859900}.light .ct-e29465{color:#859900}.light .ct-fea037{color:#859900}.light .ct-d5c40d{color:#268BD2}.light .ct-e3665f{color:#073642}.light .ct-e6fdf9{color:#268BD2}.light .ct-447e6a{color:#93A1A1}.light .ct-04ec2d{color:#268BD2}.light .ct-0864e2{color:#B58900}.light .ct-950799{color:#268BD2}.light .ct-8f0c5e{color:#D33682}.light .ct-0129f6{color:#268BD2}.light .ct-e31246{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 \"vault48.org,*.vault48.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 \"vault48.org,*.vault48.org\" \\\n --manual-public-ip-logging-ok\n"}]}]}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself to put it in crontab"}]}]},{"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","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"}]}]}]},{"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-a4046e"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-98da3d"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f42651"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-698d1a"},"children":[{"type":"text","value":"CERTBOT_VALIDATION"}]},{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f170fc"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-f42651"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-698d1a"},"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-a4046e"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":"rm -f /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-f42651"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-698d1a"},"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 \"vault48.org,*.vault48.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-83c20d"},"children":[{"type":"text","value":"certbot certonly \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" --preferred-challenges=http --manual \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"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-83c20d"},"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-83c20d"},"children":[{"type":"text","value":" -d "}]},{"type":"element","tag":"span","props":{"class":"ct-a8b618"},"children":[{"type":"text","value":"\"vault48.org,*.vault48.org\""}]},{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" --manual-public-ip-logging-ok"}]}]}]}]}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself to put it in crontab"}]}]},{"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","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-83c20d"},"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-83c20d"},"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-83c20d"},"children":[{"type":"text","value":" --manual-cleanup-hook /path/to/clean.sh"}]}]}]}]}]},{"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-a8b618{color:#A5D6FF}.ct-f170fc{color:#FF7B72}.ct-698d1a{color:#C9D1D9}.ct-f42651{color:#C9D1D9}.ct-83c20d{color:#C9D1D9}.ct-98da3d{color:#79C0FF}.ct-a4046e{color:#8B949E}.light .ct-a4046e{color:#93A1A1}.light .ct-98da3d{color:#268BD2}.light .ct-83c20d{color:#657B83}.light .ct-f42651{color:#859900}.light .ct-698d1a{color:#268BD2}.light .ct-f170fc{color:#859900}.light .ct-a8b618{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-731f9c"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-768396"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" /proc/"}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":"/status "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"do"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" awk "}]},{"type":"element","tag":"span","props":{"class":"ct-460440"},"children":[{"type":"text","value":"'/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}'"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"done"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" sort -k 2 -n -r "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" less"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-460440{color:#A5D6FF}.ct-768396{color:#C9D1D9}.ct-33f343{color:#C9D1D9}.ct-731f9c{color:#FF7B72}.light .ct-731f9c{color:#859900}.light .ct-33f343{color:#657B83}.light .ct-768396{color:#268BD2}.light .ct-460440{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-60f656"},"children":[{"type":"text","value":"Bluetooth: hci0: ACL packet "}]},{"type":"element","tag":"span","props":{"class":"ct-8a3611"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-60f656"},"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-de5892"},"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-60f656"},"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-60f656"},"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-60f656"},"children":[{"type":"text","value":"$ systool -v -m btusb "}]},{"type":"element","tag":"span","props":{"class":"ct-8a3611"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-60f656"},"children":[{"type":"text","value":" grep autosuspend"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60f656"},"children":[{"type":"text","value":" enable_autosuspend = "}]},{"type":"element","tag":"span","props":{"class":"ct-c38303"},"children":[{"type":"text","value":"\"N\""}]},{"type":"element","tag":"span","props":{"class":"ct-60f656"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-de5892"},"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-c38303{color:#A5D6FF}.ct-de5892{color:#8B949E}.ct-8a3611{color:#FF7B72}.ct-60f656{color:#C9D1D9}.light .ct-60f656{color:#657B83}.light .ct-8a3611{color:#859900}.light .ct-de5892{color:#93A1A1}.light .ct-c38303{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-fcd093"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"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-fcd093"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"gitea"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fbbf51"},"children":[{"type":"text","value":"false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"gitea/gitea:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"USER_UID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"USER_GID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"./var/lib/gitea:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"./etc/gitea:/etc/gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"/etc/timezone:/etc/timezone:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"/etc/localtime:/etc/localtime:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"\"3000:3000\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"\"222:22\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-fbbf51{color:#79C0FF}.ct-a46b89{color:#A5D6FF}.ct-fa0ee5{color:#C9D1D9}.ct-fcd093{color:#7EE787}.light .ct-fcd093{color:#268BD2}.light .ct-fa0ee5{color:#657B83}.light .ct-a46b89{color:#2AA198}.light .ct-fbbf51{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-8ee6c5"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"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-8ee6c5"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"photoprism"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"photoprism__app"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"photoprism/photoprism:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"depends_on"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"mariadb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"2342:2342"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-23b72b"},"children":[{"type":"text","value":"# HTTP port (host:container)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_ADMIN_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"password\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"https://service.url/\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_ORIGINALS_LIMIT"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-1794c0"},"children":[{"type":"text","value":"5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_HTTP_COMPRESSION"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"gzip\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DEBUG"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_PUBLIC"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_READONLY"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_EXPERIMENTAL"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CHOWN"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_WEBDAV"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_SETTINGS"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_TENSORFLOW"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_FACES"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CLASSIFICATION"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DARKTABLE_PRESETS"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DETECT_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_UPLOAD_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"true\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_DRIVER"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_SERVER"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"mariadb:3306\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_NAME"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"photoprism\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"root\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"insecure\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_TITLE"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"PhotoPrism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_CAPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"Browse Your Life\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_DESCRIPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_AUTHOR"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"HOME"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"working_dir"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"./data/originals:/photoprism/originals\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"./data/imports:/photoprism/import\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"./data/storage:/photoprism/storage\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"mariadb"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"photoprism__db"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"mariadb:10.6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"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-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"./database:/var/lib/mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-23b72b"},"children":[{"type":"text","value":"# Important, don't remove"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"MYSQL_ROOT_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"insecure"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"MYSQL_DATABASE"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"MYSQL_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"MYSQL_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"insecure"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1794c0{color:#79C0FF}.ct-23b72b{color:#8B949E}.ct-0871da{color:#A5D6FF}.ct-b8000f{color:#C9D1D9}.ct-8ee6c5{color:#7EE787}.light .ct-8ee6c5{color:#268BD2}.light .ct-b8000f{color:#657B83}.light .ct-0871da{color:#2AA198}.light .ct-23b72b{color:#93A1A1}.light .ct-1794c0{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-e908f9"},"children":[{"type":"text","value":"( screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-f06a18"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-e908f9"},"children":[{"type":"text","value":" ( screen -d bash "}]},{"type":"element","tag":"span","props":{"class":"ct-f06a18"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-e908f9"},"children":[{"type":"text","value":" screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-f06a18"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-e908f9"},"children":[{"type":"text","value":" screen -SAm bash bash ) )"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f06a18{color:#FF7B72}.ct-e908f9{color:#C9D1D9}.light .ct-e908f9{color:#657B83}.light .ct-f06a18{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-7a0e32"},"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-0e5f95"},"children":[{"type":"text","value":"PORT=22"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":"USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":"HOST=example.com"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":"REMOTE_PATH=/tmp"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":"REMOTE_FILE=sample.text"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"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-0e5f95"},"children":[{"type":"text","value":"rsync -a -e "}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\"ssh -p "}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"PORT"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":" -P -v \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"@"}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"HOST"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"REMOTE_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"REMOTE_FILE"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"DEST_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-4387dd{color:#C9D1D9}.ct-117ea9{color:#C9D1D9}.ct-e13a33{color:#A5D6FF}.ct-0e5f95{color:#C9D1D9}.ct-7a0e32{color:#8B949E}.light .ct-7a0e32{color:#93A1A1}.light .ct-0e5f95{color:#657B83}.light .ct-e13a33{color:#2AA198}.light .ct-117ea9{color:#859900}.light .ct-4387dd{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-61321c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d0cda"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6611e9"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"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-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"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-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-69a976"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-61321c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"200M;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-61321c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5b314"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" https://next.vault48.org"}]},{"type":"element","tag":"span","props":{"class":"ct-169d1e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-1f2125"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61321c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"[::]:443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-908dfd"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d0cda"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6611e9"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-169d1e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-1f2125"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-169d1e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-1f2125"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-169d1e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-1f2125"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-908dfd"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1f2125{color:#C9D1D9}.ct-169d1e{color:#C9D1D9}.ct-e5b314{color:#79C0FF}.ct-916141{color:#FF7B72}.ct-69a976{color:#FF7B72}.ct-6611e9{color:#FFA657}.ct-4d0cda{color:#FF7B72}.ct-9ce8b7{color:#C9D1D9}.ct-8181f4{color:#8B949E}.ct-908dfd{color:#C9D1D9}.ct-61321c{color:#FF7B72}.light .ct-61321c{color:#073642}.light .ct-908dfd{color:#657B83}.light .ct-8181f4{color:#93A1A1}.light .ct-9ce8b7{color:#657B83}.light .ct-4d0cda{color:#073642}.light .ct-6611e9{color:#657B83}.light .ct-69a976{color:#657B83}.light .ct-916141{color:#859900}.light .ct-e5b314{color:#D33682}.light .ct-169d1e{color:#859900}.light .ct-1f2125{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-8fdecd"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"'3'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"couchserver"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"obsidian__database"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"couchdb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"\"5984:5984\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"COUCHDB_USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"COUCHDB_PASSWORD=somepassword"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"./couchdb/dbdata:/opt/couchdb/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"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-a6ec15"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"[::]:80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-617671"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" https://"}]},{"type":"element","tag":"span","props":{"class":"ct-e436df"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-564319"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-e436df"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-564319"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a6ec15"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"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-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/fullchain.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-05944b"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/privkey.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-05944b"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"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-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"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-e2d51b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2fec91"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-e2d51b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4e8335"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-e2d51b"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-e436df"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-564319"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-e436df"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-564319"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-e436df"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-564319"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"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-25677f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"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-4e8335{color:#FFA657}.ct-2fec91{color:#FF7B72}.ct-e2d51b{color:#C9D1D9}.ct-05944b{color:#8B949E}.ct-564319{color:#C9D1D9}.ct-e436df{color:#C9D1D9}.ct-617671{color:#79C0FF}.ct-5e81bc{color:#FF7B72}.ct-a6ec15{color:#FF7B72}.ct-1bc9e9{color:#A5D6FF}.ct-25677f{color:#C9D1D9}.ct-8fdecd{color:#7EE787}.light .ct-8fdecd{color:#268BD2}.light .ct-25677f{color:#657B83}.light .ct-1bc9e9{color:#2AA198}.light .ct-a6ec15{color:#073642}.light .ct-5e81bc{color:#859900}.light .ct-617671{color:#D33682}.light .ct-e436df{color:#859900}.light .ct-564319{color:#268BD2}.light .ct-05944b{color:#93A1A1}.light .ct-e2d51b{color:#657B83}.light .ct-2fec91{color:#073642}.light .ct-4e8335{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-d37555"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d37555"},"children":[{"type":"text","value":"sudo apt install mariadb-server"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d37555"},"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-d37555"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d37555"},"children":[{"type":"text","value":"bind-"}]},{"type":"element","tag":"span","props":{"class":"ct-161d77"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-d37555"},"children":[{"type":"text","value":" = 0.0.0.0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d37555"},"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-161d77{color:#FF7B72}.ct-d37555{color:#C9D1D9}.light .ct-d37555{color:#657B83}.light .ct-161d77{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-eb2006"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eb2006"},"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-eb2006"},"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-eb2006"},"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-eb2006"},"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-eb2006"},"children":[{"type":"text","value":"Type "}]},{"type":"element","tag":"span","props":{"class":"ct-1c8deb"},"children":[{"type":"text","value":"\"help\""}]},{"type":"element","tag":"span","props":{"class":"ct-eb2006"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6ea5a"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-eb2006"},"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-eb2006"},"children":[{"type":"text","value":"postgres="}]},{"type":"element","tag":"span","props":{"class":"ct-eb3f14"},"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-eb2006"},"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-eb2006"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f2cca"},"children":[{"type":"text","value":"local"}]},{"type":"element","tag":"span","props":{"class":"ct-eb2006"},"children":[{"type":"text","value":" all postgres peer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eb2006"},"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-eb2006"},"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-eb2006"},"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-7f2cca{color:#FF7B72}.ct-eb3f14{color:#8B949E}.ct-f6ea5a{color:#FF7B72}.ct-1c8deb{color:#A5D6FF}.ct-eb2006{color:#C9D1D9}.light .ct-eb2006{color:#657B83}.light .ct-1c8deb{color:#2AA198}.light .ct-f6ea5a{color:#859900}.light .ct-eb3f14{color:#93A1A1}.light .ct-7f2cca{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-14c263"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-350da4"},"children":[{"type":"text","value":"global"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d2a04d"},"children":[{"type":"text","value":"Window"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad8636"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58bfb8"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"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-87910e"},"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-9b1985"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"class"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d2a04d"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-87910e"},"children":[{"type":"text","value":"// nothing :-)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"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-87910e"},"children":[{"type":"text","value":"// fancyThings.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-350da4"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca28c2"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca28c2"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d2a04d"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad8636"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58bfb8"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"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-9b1985"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-350da4"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca28c2"},"children":[{"type":"text","value":"\"./sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca28c2"},"children":[{"type":"text","value":"\"./fancyThings\""}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-025a28"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad8636"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-350da4"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ad8636"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":"(); "}]},{"type":"element","tag":"span","props":{"class":"ct-87910e"},"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-025a28{color:#79C0FF}.ct-ca28c2{color:#A5D6FF}.ct-87910e{color:#8B949E}.ct-58bfb8{color:#79C0FF}.ct-9b1985{color:#FF7B72}.ct-ad8636{color:#D2A8FF}.ct-d2a04d{color:#FFA657}.ct-350da4{color:#C9D1D9}.ct-678de0{color:#C9D1D9}.ct-14c263{color:#FF7B72}.light .ct-14c263{color:#073642}.light .ct-678de0{color:#657B83}.light .ct-350da4{color:#268BD2}.light .ct-d2a04d{color:#268BD2}.light .ct-ad8636{color:#268BD2}.light .ct-9b1985{color:#859900}.light .ct-58bfb8{color:#859900}.light .ct-87910e{color:#93A1A1}.light .ct-ca28c2{color:#2AA198}.light .ct-025a28{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-097431"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0935dd"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"'./en.json'"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"typeof"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0935dd"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc0e15"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-33e71b"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-649304"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6035c6"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-649304"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ccbb6"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6035c6"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-649304"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ccbb6"},"children":[{"type":"text","value":"TranslateOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-bc0e15"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0935dd"},"children":[{"type":"text","value":"I18nLib"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-beca33"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-0935dd"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0935dd"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"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-5e35ff"},"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-5e35ff"},"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-097431"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e35ff"},"children":[{"type":"text","value":"// plural object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"''"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" { ["}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"-?:"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"]>> }["}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5e35ff"},"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-c6e64e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"'one'"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"'few'"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"'many'"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"}${''"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"'.'}${"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":">];"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-bab85e{color:#A5D6FF}.ct-0ab8ab{color:#79C0FF}.ct-9ff890{color:#79C0FF}.ct-5e35ff{color:#8B949E}.ct-beca33{color:#D2A8FF}.ct-7ccbb6{color:#FFA657}.ct-6035c6{color:#FFA657}.ct-649304{color:#FF7B72}.ct-33e71b{color:#D2A8FF}.ct-7b2d18{color:#C9D1D9}.ct-bc0e15{color:#FF7B72}.ct-9ebe25{color:#FFA657}.ct-c6e64e{color:#FF7B72}.ct-b0dea2{color:#A5D6FF}.ct-0935dd{color:#C9D1D9}.ct-aa92c5{color:#C9D1D9}.ct-097431{color:#FF7B72}.light .ct-097431{color:#859900}.light .ct-aa92c5{color:#657B83}.light .ct-0935dd{color:#268BD2}.light .ct-b0dea2{color:#2AA198}.light .ct-c6e64e{color:#073642}.light .ct-9ebe25{color:#268BD2}.light .ct-bc0e15{color:#073642}.light .ct-7b2d18{color:#657B83}.light .ct-33e71b{color:#268BD2}.light .ct-649304{color:#859900}.light .ct-6035c6{color:#657B83}.light .ct-7ccbb6{color:#268BD2}.light .ct-beca33{color:#268BD2}.light .ct-5e35ff{color:#93A1A1}.light .ct-9ff890{color:#859900}.light .ct-0ab8ab{color:#D33682}.light .ct-bab85e{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-d84b94"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d29147"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7f7efa"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-e5c636"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-939d0a"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c636"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-939d0a"},"children":[{"type":"text","value":"Bird"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-e5c636"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f7efa"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c636"},"children":[{"type":"text","value":"is"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-939d0a"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-ba46a6"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-200008"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-ba46a6"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1d16bf"},"children":[{"type":"text","value":"undefined"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"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-6136c4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e6c43"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0a066"},"children":[{"type":"text","value":"getSmallPet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e0a066"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ba46a6"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba46a6"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e0a066"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba46a6"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e0a066"},"children":[{"type":"text","value":"fly"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e0a066{color:#D2A8FF}.ct-9e6c43{color:#79C0FF}.ct-6136c4{color:#FF7B72}.ct-1d16bf{color:#79C0FF}.ct-200008{color:#FFA657}.ct-ba46a6{color:#C9D1D9}.ct-a56ef8{color:#FF7B72}.ct-37d612{color:#C9D1D9}.ct-939d0a{color:#FFA657}.ct-e5c636{color:#FF7B72}.ct-7f7efa{color:#FFA657}.ct-d29147{color:#D2A8FF}.ct-8fe02f{color:#C9D1D9}.ct-d84b94{color:#FF7B72}.light .ct-d84b94{color:#073642}.light .ct-8fe02f{color:#657B83}.light .ct-d29147{color:#268BD2}.light .ct-7f7efa{color:#657B83}.light .ct-e5c636{color:#859900}.light .ct-939d0a{color:#268BD2}.light .ct-37d612{color:#657B83}.light .ct-a56ef8{color:#859900}.light .ct-ba46a6{color:#268BD2}.light .ct-200008{color:#268BD2}.light .ct-1d16bf{color:#B58900}.light .ct-6136c4{color:#073642}.light .ct-9e6c43{color:#268BD2}.light .ct-e0a066{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":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 diff --git a/docs/api/_content/query/068glZS8Mz.json b/docs/api/_content/query/068glZS8Mz.json index 718e385..0a3d6de 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-fc4738"},"children":[{"type":"text","value":"$cell: "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"250"}]},{"type":"element","tag":"span","props":{"class":"ct-500cf0"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc4738"},"children":[{"type":"text","value":"$gap: "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"20"}]},{"type":"element","tag":"span","props":{"class":"ct-500cf0"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-228947"},"children":[{"type":"text","value":".grid"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5bf74e"},"children":[{"type":"text","value":"display"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-99f92d"},"children":[{"type":"text","value":"grid"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5bf74e"},"children":[{"type":"text","value":"grid-template-columns"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-88ce24"},"children":[{"type":"text","value":"repeat"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-65bc06"},"children":[{"type":"text","value":"auto-fit"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-88ce24"},"children":[{"type":"text","value":"minmax"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-65bc06"},"children":[{"type":"text","value":"$cell"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-fadfc2"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-ab1c70"},"children":[{"type":"text","value":"fr"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-auto-rows"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"256"}]},{"type":"element","tag":"span","props":{"class":"ct-500cf0"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5bf74e"},"children":[{"type":"text","value":"grid-auto-flow"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-99f92d"},"children":[{"type":"text","value":"row"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-99f92d"},"children":[{"type":"text","value":"dense"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5bf74e"},"children":[{"type":"text","value":"grid-column-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65bc06"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5bf74e"},"children":[{"type":"text","value":"grid-row-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65bc06"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-4ca3c1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"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-228947"},"children":[{"type":"text","value":".h-2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7df285"},"children":[{"type":"text","value":"// takes 2 columns"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-column-end"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-228947"},"children":[{"type":"text","value":".v-2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7df285"},"children":[{"type":"text","value":"// takes 2 rows"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-row-end"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"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-228947"},"children":[{"type":"text","value":".full-width"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-500cf0"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-7df285"},"children":[{"type":"text","value":"// height: 1 row"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"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-228947"},"children":[{"type":"text","value":".top-right"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-500cf0"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-7df285"},"children":[{"type":"text","value":"// height here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6def5a"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"-2"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-c77f9d"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-7df285"},"children":[{"type":"text","value":"// width here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e26c6a"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7df285{color:#8B949E}.ct-6def5a{color:#79C0FF}.ct-ab1c70{color:#FF7B72}.ct-fadfc2{color:#79C0FF}.ct-65bc06{color:#FFA657}.ct-88ce24{color:#79C0FF}.ct-99f92d{color:#79C0FF}.ct-5bf74e{color:#79C0FF}.ct-4ca3c1{color:#C9D1D9}.ct-228947{color:#79C0FF}.ct-e26c6a{color:#C9D1D9}.ct-500cf0{color:#FF7B72}.ct-c77f9d{color:#79C0FF}.ct-fc4738{color:#FFA657}.light .ct-fc4738{color:#657B83}.light .ct-c77f9d{color:#D33682}.light .ct-500cf0{color:#859900}.light .ct-e26c6a{color:#657B83}.light .ct-228947{color:#93A1A1}.light .ct-4ca3c1{color:#657B83}.light .ct-5bf74e{color:#859900}.light .ct-99f92d{color:#657B83}.light .ct-88ce24{color:#268BD2}.light .ct-65bc06{color:#657B83}.light .ct-fadfc2{color:#D33682}.light .ct-ab1c70{color:#859900}.light .ct-6def5a{color:#859900}.light .ct-7df285{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-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 diff --git a/docs/api/_content/query/1Q9jaWh0XH.json b/docs/api/_content/query/1Q9jaWh0XH.json index 9d2ad6f..ff2f6ec 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-8fdecd"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"'3'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"couchserver"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"obsidian__database"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"couchdb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"\"5984:5984\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"COUCHDB_USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"COUCHDB_PASSWORD=somepassword"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8fdecd"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"children":[{"type":"text","value":"./couchdb/dbdata:/opt/couchdb/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-1bc9e9"},"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-a6ec15"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"[::]:80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-617671"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" https://"}]},{"type":"element","tag":"span","props":{"class":"ct-e436df"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-564319"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-e436df"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-564319"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a6ec15"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"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-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/fullchain.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-05944b"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/privkey.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-05944b"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"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-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"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-e2d51b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2fec91"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-e2d51b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4e8335"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-e2d51b"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-e436df"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-564319"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-e436df"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-564319"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-e436df"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-564319"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e81bc"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-25677f"},"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-25677f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25677f"},"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-4e8335{color:#FFA657}.ct-2fec91{color:#FF7B72}.ct-e2d51b{color:#C9D1D9}.ct-05944b{color:#8B949E}.ct-564319{color:#C9D1D9}.ct-e436df{color:#C9D1D9}.ct-617671{color:#79C0FF}.ct-5e81bc{color:#FF7B72}.ct-a6ec15{color:#FF7B72}.ct-1bc9e9{color:#A5D6FF}.ct-25677f{color:#C9D1D9}.ct-8fdecd{color:#7EE787}.light .ct-8fdecd{color:#268BD2}.light .ct-25677f{color:#657B83}.light .ct-1bc9e9{color:#2AA198}.light .ct-a6ec15{color:#073642}.light .ct-5e81bc{color:#859900}.light .ct-617671{color:#D33682}.light .ct-e436df{color:#859900}.light .ct-564319{color:#268BD2}.light .ct-05944b{color:#93A1A1}.light .ct-e2d51b{color:#657B83}.light .ct-2fec91{color:#073642}.light .ct-4e8335{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-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 diff --git a/docs/api/_content/query/23vTOdYUTM.json b/docs/api/_content/query/23vTOdYUTM.json index 46ad966..4725746 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 \"vault48.org,*.vault48.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 \"vault48.org,*.vault48.org\" \\\n --manual-public-ip-logging-ok\n"}]}]}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself to put it in crontab"}]}]},{"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","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"}]}]}]},{"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-a4046e"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-98da3d"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f42651"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-698d1a"},"children":[{"type":"text","value":"CERTBOT_VALIDATION"}]},{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f170fc"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-f42651"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-698d1a"},"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-a4046e"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":"rm -f /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-f42651"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-698d1a"},"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 \"vault48.org,*.vault48.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-83c20d"},"children":[{"type":"text","value":"certbot certonly \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" --preferred-challenges=http --manual \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"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-83c20d"},"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-83c20d"},"children":[{"type":"text","value":" -d "}]},{"type":"element","tag":"span","props":{"class":"ct-a8b618"},"children":[{"type":"text","value":"\"vault48.org,*.vault48.org\""}]},{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83c20d"},"children":[{"type":"text","value":" --manual-public-ip-logging-ok"}]}]}]}]}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself to put it in crontab"}]}]},{"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","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-83c20d"},"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-83c20d"},"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-83c20d"},"children":[{"type":"text","value":" --manual-cleanup-hook /path/to/clean.sh"}]}]}]}]}]},{"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-a8b618{color:#A5D6FF}.ct-f170fc{color:#FF7B72}.ct-698d1a{color:#C9D1D9}.ct-f42651{color:#C9D1D9}.ct-83c20d{color:#C9D1D9}.ct-98da3d{color:#79C0FF}.ct-a4046e{color:#8B949E}.light .ct-a4046e{color:#93A1A1}.light .ct-98da3d{color:#268BD2}.light .ct-83c20d{color:#657B83}.light .ct-f42651{color:#859900}.light .ct-698d1a{color:#268BD2}.light .ct-f170fc{color:#859900}.light .ct-a8b618{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-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 diff --git a/docs/api/_content/query/2vMf3x3doM.json b/docs/api/_content/query/2vMf3x3doM.json index 36cb244..01b795c 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-a8abaf"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30ee11"},"children":[{"type":"text","value":"listItems"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"filter"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"sort"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"limit"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"): "}]},{"type":"element","tag":"span","props":{"class":"ct-30ee11"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"input"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4281e"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4281e"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": ["}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"Item"}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c7858e"},"children":[{"type":"text","value":"Int"}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"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-a8abaf"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8211dc"},"children":[{"type":"text","value":"'@apollo/client'"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-302f13"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2310f1"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30ee11"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" cache: "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30ee11"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"({ "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-302f13"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2310f1"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9e1a3"},"children":[{"type":"text","value":"TypePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" Query: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" fields: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// query name"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" listItems: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"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-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"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-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// consider choosing the right fields, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"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-684206"},"children":[{"type":"text","value":" keyArgs: ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8211dc"},"children":[{"type":"text","value":"'sort'"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// primitive type"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8211dc"},"children":[{"type":"text","value":"'filter'"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":", ["}]},{"type":"element","tag":"span","props":{"class":"ct-8211dc"},"children":[{"type":"text","value":"'name'"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-8211dc"},"children":[{"type":"text","value":"'type'"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// nested fields of `filter`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" ],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" merge: "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"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-42c786"},"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-186acb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3ad0bb"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c1dd0b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-450d23"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-186acb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-91b1ff"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// no existing data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"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-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// merge cache and incoming data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-302f13"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2310f1"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c786"},"children":[{"type":"text","value":"// apply latest result for totalCount"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-302f13"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2310f1"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8abaf"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5893ae"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-684206"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-3ad0bb{color:#D2A8FF}.ct-186acb{color:#FF7B72}.ct-e9e1a3{color:#FFA657}.ct-42c786{color:#8B949E}.ct-2310f1{color:#79C0FF}.ct-302f13{color:#FF7B72}.ct-8211dc{color:#A5D6FF}.ct-5893ae{color:#C9D1D9}.ct-c1dd0b{color:#FF7B72}.ct-c4281e{color:#79C0FF}.ct-c7858e{color:#79C0FF}.ct-450d23{color:#FFA657}.ct-91b1ff{color:#C9D1D9}.ct-30ee11{color:#D2A8FF}.ct-684206{color:#C9D1D9}.ct-a8abaf{color:#FF7B72}.light .ct-a8abaf{color:#859900}.light .ct-684206{color:#657B83}.light .ct-30ee11{color:#268BD2}.light .ct-91b1ff{color:#657B83}.light .ct-450d23{color:#657B83}.light .ct-c7858e{color:#859900}.light .ct-c4281e{color:#859900}.light .ct-c1dd0b{color:#859900}.light .ct-5893ae{color:#268BD2}.light .ct-8211dc{color:#2AA198}.light .ct-302f13{color:#073642}.light .ct-2310f1{color:#268BD2}.light .ct-42c786{color:#93A1A1}.light .ct-e9e1a3{color:#268BD2}.light .ct-186acb{color:#073642}.light .ct-3ad0bb{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-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 diff --git a/docs/api/_content/query/4AUGrl0JGY.json b/docs/api/_content/query/4AUGrl0JGY.json index aeec447..40c0b0d 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-b43981"},"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-0b0467"},"children":[{"type":"text","value":"wait_for_redis"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-b43981"},"children":[{"type":"text","value":"# 3 minutes"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-c8e976"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" redis-cli -h localhost -p 6379 -a "}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" ping "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\"PONG\""}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":"/dev/null "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"2>&1;"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-e756ed"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8e976"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":"\"[Error] can't properly ping Redis container after "}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-cf12d8"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-81100c"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-622801"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8e976"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7377"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b3a4"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b43981"},"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-e756ed{color:#79C0FF}.ct-cf12d8{color:#C9D1D9}.ct-81100c{color:#C9D1D9}.ct-622801{color:#A5D6FF}.ct-c8e976{color:#79C0FF}.ct-5f7377{color:#FF7B72}.ct-c2b3a4{color:#C9D1D9}.ct-0b0467{color:#D2A8FF}.ct-b43981{color:#8B949E}.light .ct-b43981{color:#93A1A1}.light .ct-0b0467{color:#268BD2}.light .ct-c2b3a4{color:#657B83}.light .ct-5f7377{color:#859900}.light .ct-c8e976{color:#268BD2}.light .ct-622801{color:#2AA198}.light .ct-81100c{color:#859900}.light .ct-cf12d8{color:#268BD2}.light .ct-e756ed{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-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 diff --git a/docs/api/_content/query/8cFyiEqgoq.json b/docs/api/_content/query/8cFyiEqgoq.json index 5befb1f..d4df2a6 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-226c8e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"children":[{"type":"text","value":"// URL of your node"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'https://...'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-940990"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a35ac1"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-446270"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-940990"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-b0eabc"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-446270"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d811b"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-940990"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-41a6ec"},"children":[{"type":"text","value":"// first we need to authorize"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"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-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getCurrentAddressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getTransactionCount"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" gasLimit: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" nonce: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"EthUtil"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"Transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"sign"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"serialize"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"this"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"`0x${"}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-5ce9b7"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-5ce9b7"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'hex'"}]},{"type":"element","tag":"span","props":{"class":"ct-5ce9b7"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-226c8e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"estimateFee"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed33ff"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"asciiToHex"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" })."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"fromWei"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f2dcb5"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"())"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"multiply"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f2dcb5"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"()))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-226c8e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'accountsChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-dde42d"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'chainChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"handler"}]},{"type":"element","tag":"span","props":{"class":"ct-dbcf14"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-dde42d"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"ethereum"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'wallet_watchAsset'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" params: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" type: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'ERC20'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" options: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" address: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'0xb60e8dd61c5d32be8058bb8eb970870f07233155'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'FOO'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-d68aa3"},"children":[{"type":"text","value":"18"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" image: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'https://foo.io/token-image.svg'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-a35ac1"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-b0eabc"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-940990"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b083a6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'FOO successfully added to wallet!'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f2dcb5"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'Something went wrong.'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-123e61"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"getChainID"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-123e61"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'eth_chainId'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"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-226c8e"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'wallet_switchEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" params: [{ chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }], "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"switchError"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"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-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d68aa3"},"children":[{"type":"text","value":"4902"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-06153f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'wallet_addEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" params: [{ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" chainName: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'Ropsten Test Network'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" nativeCurrency: { "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" name: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-d68aa3"},"children":[{"type":"text","value":"18"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" rpcUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"], "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" blockExplorerUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-e623ce"},"children":[{"type":"text","value":"'https://ropsten.etherscan.io'"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }] ,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-226c8e"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dde42d"},"children":[{"type":"text","value":"addError"}]},{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"children":[{"type":"text","value":"// handle \"add\" error"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6ec"},"children":[{"type":"text","value":"// handle other \"switch\" errors"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20fec6"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-d68aa3{color:#79C0FF}.ct-dbcf14{color:#C9D1D9}.ct-f2dcb5{color:#79C0FF}.ct-5ce9b7{color:#A5D6FF}.ct-4d811b{color:#79C0FF}.ct-b0eabc{color:#FFA657}.ct-446270{color:#FF7B72}.ct-a35ac1{color:#D2A8FF}.ct-b083a6{color:#C9D1D9}.ct-940990{color:#FF7B72}.ct-06153f{color:#D2A8FF}.ct-ed33ff{color:#79C0FF}.ct-123e61{color:#FF7B72}.ct-41a6ec{color:#8B949E}.ct-e623ce{color:#A5D6FF}.ct-dde42d{color:#C9D1D9}.ct-20fec6{color:#C9D1D9}.ct-226c8e{color:#FF7B72}.light .ct-226c8e{color:#859900}.light .ct-20fec6{color:#657B83}.light .ct-dde42d{color:#268BD2}.light .ct-e623ce{color:#2AA198}.light .ct-41a6ec{color:#93A1A1}.light .ct-123e61{color:#073642}.light .ct-ed33ff{color:#268BD2}.light .ct-06153f{color:#268BD2}.light .ct-940990{color:#073642}.light .ct-b083a6{color:#657B83}.light .ct-a35ac1{color:#268BD2}.light .ct-446270{color:#859900}.light .ct-b0eabc{color:#657B83}.light .ct-4d811b{color:#859900}.light .ct-5ce9b7{color:#657B83}.light .ct-f2dcb5{color:#859900}.light .ct-dbcf14{color:#859900}.light .ct-d68aa3{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-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 diff --git a/docs/api/_content/query/CMMQ5oxSPg.json b/docs/api/_content/query/CMMQ5oxSPg.json index 21f351c..9269ebd 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-842e6b"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a29"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a29"},"children":[{"type":"text","value":"'axios'"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ea340"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"useGetUsers"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ea340"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"());"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ea340"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ea340"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b24a29"},"children":[{"type":"text","value":"\"/\""}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24840b"},"children":[{"type":"text","value":"// params and props here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" signal: "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"signal"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ea340"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-a500ef"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"abort"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24840b"},"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-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d15e84"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-842e6b"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c3b3b5"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-823297"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-24840b{color:#8B949E}.ct-d15e84{color:#D2A8FF}.ct-2ea340{color:#79C0FF}.ct-a500ef{color:#FF7B72}.ct-b24a29{color:#A5D6FF}.ct-c3b3b5{color:#C9D1D9}.ct-823297{color:#C9D1D9}.ct-842e6b{color:#FF7B72}.light .ct-842e6b{color:#859900}.light .ct-823297{color:#657B83}.light .ct-c3b3b5{color:#268BD2}.light .ct-b24a29{color:#2AA198}.light .ct-a500ef{color:#073642}.light .ct-2ea340{color:#268BD2}.light .ct-d15e84{color:#268BD2}.light .ct-24840b{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-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 diff --git a/docs/api/_content/query/DliR2N9mzp.json b/docs/api/_content/query/DliR2N9mzp.json index 2cf8218..20c6fda 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-61321c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d0cda"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6611e9"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"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-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"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-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-69a976"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-61321c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"200M;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-61321c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5b314"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" https://next.vault48.org"}]},{"type":"element","tag":"span","props":{"class":"ct-169d1e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-1f2125"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61321c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"[::]:443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8181f4"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-908dfd"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d0cda"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6611e9"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-9ce8b7"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-169d1e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-1f2125"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-169d1e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-1f2125"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-169d1e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-1f2125"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-916141"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"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-908dfd"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-908dfd"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1f2125{color:#C9D1D9}.ct-169d1e{color:#C9D1D9}.ct-e5b314{color:#79C0FF}.ct-916141{color:#FF7B72}.ct-69a976{color:#FF7B72}.ct-6611e9{color:#FFA657}.ct-4d0cda{color:#FF7B72}.ct-9ce8b7{color:#C9D1D9}.ct-8181f4{color:#8B949E}.ct-908dfd{color:#C9D1D9}.ct-61321c{color:#FF7B72}.light .ct-61321c{color:#073642}.light .ct-908dfd{color:#657B83}.light .ct-8181f4{color:#93A1A1}.light .ct-9ce8b7{color:#657B83}.light .ct-4d0cda{color:#073642}.light .ct-6611e9{color:#657B83}.light .ct-69a976{color:#657B83}.light .ct-916141{color:#859900}.light .ct-e5b314{color:#D33682}.light .ct-169d1e{color:#859900}.light .ct-1f2125{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-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 diff --git a/docs/api/_content/query/EH6LeCIDqM.json b/docs/api/_content/query/EH6LeCIDqM.json index 3e14b47..7386e0a 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-70f0f3"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" --entrypoint htpasswd registry:2 \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" -Bbn user mypassword "}]},{"type":"element","tag":"span","props":{"class":"ct-1380ba"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"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-e4a10d"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"docker__registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"registry:2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"5000:5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_AUTH=htpasswd"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_AUTH_HTPASSWD_REALM=Registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"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-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_HTTP_SECRET=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_STORAGE_DELETE_ENABLED=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"./registry/auth:/auth"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"./registry/data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"ui"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"docker__ui"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"parabuzzle/craneoperator:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"80:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4a10d"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_HOST=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_PORT=5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_PROTOCOL=http"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"ALLOW_REGISTRY_LOGIN=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"REGISTRY_ALLOW_DELETE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"USERNAME=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"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-d1e433"},"children":[{"type":"text","value":"# Try this first"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" --rm anoxis/registry-cli \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" -r https://registry.url \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" -l user:password \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" --delete \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"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-d1e433"},"children":[{"type":"text","value":"# Then this "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":"docker run -it \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"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-70f0f3"},"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-70f0f3"},"children":[{"type":"text","value":" -e DRY_RUN="}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" -e REGISTRY_AUTH="}]},{"type":"element","tag":"span","props":{"class":"ct-65a7ad"},"children":[{"type":"text","value":"\"user:password\""}]},{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-70f0f3"},"children":[{"type":"text","value":" mortensrasmussen/docker-registry-manifest-cleanup"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-d1e433{color:#8B949E}.ct-65a7ad{color:#A5D6FF}.ct-e4a10d{color:#7EE787}.ct-1380ba{color:#FF7B72}.ct-70f0f3{color:#C9D1D9}.light .ct-70f0f3{color:#657B83}.light .ct-1380ba{color:#859900}.light .ct-e4a10d{color:#268BD2}.light .ct-65a7ad{color:#2AA198}.light .ct-d1e433{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-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 diff --git a/docs/api/_content/query/FLiVxDo2qK.json b/docs/api/_content/query/FLiVxDo2qK.json index d27acc2..5c31645 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-14c263"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-350da4"},"children":[{"type":"text","value":"global"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d2a04d"},"children":[{"type":"text","value":"Window"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad8636"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58bfb8"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"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-87910e"},"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-9b1985"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"class"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d2a04d"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-87910e"},"children":[{"type":"text","value":"// nothing :-)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"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-87910e"},"children":[{"type":"text","value":"// fancyThings.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-350da4"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca28c2"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca28c2"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d2a04d"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad8636"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58bfb8"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-678de0"},"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-9b1985"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-350da4"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca28c2"},"children":[{"type":"text","value":"\"./sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca28c2"},"children":[{"type":"text","value":"\"./fancyThings\""}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-14c263"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-025a28"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b1985"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad8636"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-350da4"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ad8636"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-678de0"},"children":[{"type":"text","value":"(); "}]},{"type":"element","tag":"span","props":{"class":"ct-87910e"},"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-025a28{color:#79C0FF}.ct-ca28c2{color:#A5D6FF}.ct-87910e{color:#8B949E}.ct-58bfb8{color:#79C0FF}.ct-9b1985{color:#FF7B72}.ct-ad8636{color:#D2A8FF}.ct-d2a04d{color:#FFA657}.ct-350da4{color:#C9D1D9}.ct-678de0{color:#C9D1D9}.ct-14c263{color:#FF7B72}.light .ct-14c263{color:#073642}.light .ct-678de0{color:#657B83}.light .ct-350da4{color:#268BD2}.light .ct-d2a04d{color:#268BD2}.light .ct-ad8636{color:#268BD2}.light .ct-9b1985{color:#859900}.light .ct-58bfb8{color:#859900}.light .ct-87910e{color:#93A1A1}.light .ct-ca28c2{color:#2AA198}.light .ct-025a28{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-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 diff --git a/docs/api/_content/query/FVXoGazg6u.json b/docs/api/_content/query/FVXoGazg6u.json index 311cea7..58a670b 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-731f9c"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-768396"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" /proc/"}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":"/status "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"do"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" awk "}]},{"type":"element","tag":"span","props":{"class":"ct-460440"},"children":[{"type":"text","value":"'/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}'"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"done"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" sort -k 2 -n -r "}]},{"type":"element","tag":"span","props":{"class":"ct-731f9c"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-33f343"},"children":[{"type":"text","value":" less"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-460440{color:#A5D6FF}.ct-768396{color:#C9D1D9}.ct-33f343{color:#C9D1D9}.ct-731f9c{color:#FF7B72}.light .ct-731f9c{color:#859900}.light .ct-33f343{color:#657B83}.light .ct-768396{color:#268BD2}.light .ct-460440{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-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 diff --git a/docs/api/_content/query/KIXVn92YTN.json b/docs/api/_content/query/KIXVn92YTN.json index 668e2de..c2840fd 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-bf76e7"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"\"axios\""}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"React"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50afea"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d3e13b"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-e7668c"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-e7668c"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4ca53d"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-e7668c"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4ca53d"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90d7a6"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" client: "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f099ac"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-f099ac"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" )."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"<() "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90d7a6"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":">(() "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5aedf5"},"children":[{"type":"text","value":"// TODO: implement me"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90d7a6"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"\"not implemented\""}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5aedf5"},"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-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"`Bearer ${"}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-0deb7f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90d7a6"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5aedf5"},"children":[{"type":"text","value":"// refreshing interceptor"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-37e1cc"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b58b07"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a8e7f4"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1950bd"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-90c8db"},"children":[{"type":"text","value":"\"Bearer \""}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90d7a6"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"Provider"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"{{ "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" }}"}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":">"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":" {"}]},{"type":"element","tag":"span","props":{"class":"ct-0f7fe5"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-64168b"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"useAPI"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-3d65cb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a482ec"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bf76e7"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-e779cf"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-ed570f"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-a8e7f4{color:#79C0FF}.ct-b58b07{color:#79C0FF}.ct-0deb7f{color:#A5D6FF}.ct-5aedf5{color:#8B949E}.ct-f099ac{color:#FFA657}.ct-1950bd{color:#79C0FF}.ct-90d7a6{color:#79C0FF}.ct-3d65cb{color:#FF7B72}.ct-a482ec{color:#D2A8FF}.ct-4ca53d{color:#79C0FF}.ct-e7668c{color:#FF7B72}.ct-0f7fe5{color:#FFA657}.ct-d3e13b{color:#79C0FF}.ct-50afea{color:#FFA657}.ct-64168b{color:#C9D1D9}.ct-37e1cc{color:#FF7B72}.ct-90c8db{color:#A5D6FF}.ct-e779cf{color:#C9D1D9}.ct-ed570f{color:#C9D1D9}.ct-bf76e7{color:#FF7B72}.light .ct-bf76e7{color:#859900}.light .ct-ed570f{color:#657B83}.light .ct-e779cf{color:#268BD2}.light .ct-90c8db{color:#2AA198}.light .ct-37e1cc{color:#073642}.light .ct-64168b{color:#657B83}.light .ct-50afea{color:#268BD2}.light .ct-d3e13b{color:#657B83}.light .ct-0f7fe5{color:#657B83}.light .ct-e7668c{color:#859900}.light .ct-4ca53d{color:#859900}.light .ct-a482ec{color:#268BD2}.light .ct-3d65cb{color:#073642}.light .ct-90d7a6{color:#859900}.light .ct-1950bd{color:#268BD2}.light .ct-f099ac{color:#268BD2}.light .ct-5aedf5{color:#93A1A1}.light .ct-0deb7f{color:#657B83}.light .ct-b58b07{color:#D33682}.light .ct-a8e7f4{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-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 diff --git a/docs/api/_content/query/LKdFxpydAG.json b/docs/api/_content/query/LKdFxpydAG.json index 02b15b4..9e1c4f8 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-eb2006"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eb2006"},"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-eb2006"},"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-eb2006"},"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-eb2006"},"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-eb2006"},"children":[{"type":"text","value":"Type "}]},{"type":"element","tag":"span","props":{"class":"ct-1c8deb"},"children":[{"type":"text","value":"\"help\""}]},{"type":"element","tag":"span","props":{"class":"ct-eb2006"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6ea5a"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-eb2006"},"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-eb2006"},"children":[{"type":"text","value":"postgres="}]},{"type":"element","tag":"span","props":{"class":"ct-eb3f14"},"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-eb2006"},"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-eb2006"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f2cca"},"children":[{"type":"text","value":"local"}]},{"type":"element","tag":"span","props":{"class":"ct-eb2006"},"children":[{"type":"text","value":" all postgres peer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eb2006"},"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-eb2006"},"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-eb2006"},"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-7f2cca{color:#FF7B72}.ct-eb3f14{color:#8B949E}.ct-f6ea5a{color:#FF7B72}.ct-1c8deb{color:#A5D6FF}.ct-eb2006{color:#C9D1D9}.light .ct-eb2006{color:#657B83}.light .ct-1c8deb{color:#2AA198}.light .ct-f6ea5a{color:#859900}.light .ct-eb3f14{color:#93A1A1}.light .ct-7f2cca{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-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 diff --git a/docs/api/_content/query/Llpj9LBd4i.json b/docs/api/_content/query/Llpj9LBd4i.json index d02aacd..7d4fad3 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-d0cc10"},"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-d7619b"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-df759b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d7619b"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8311bd"},"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-bee573"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bee573"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8311bd"},"children":[{"type":"text","value":"'vue'"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bee573"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fc1c1f"},"children":[{"type":"text","value":"ComponentCustomProperties"}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8273bb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-17e750"},"children":[{"type":"text","value":"$translate"}]},{"type":"element","tag":"span","props":{"class":"ct-42aed1"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-8273bb"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-72e938"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-42aed1"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-8273bb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4fa542"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-8273bb"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e809ed"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-8273bb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4fa542"},"children":[{"type":"text","value":"string"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-be2779"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e809ed{color:#FF7B72}.ct-4fa542{color:#79C0FF}.ct-72e938{color:#FFA657}.ct-42aed1{color:#FF7B72}.ct-17e750{color:#D2A8FF}.ct-8273bb{color:#C9D1D9}.ct-fc1c1f{color:#FFA657}.ct-bee573{color:#FF7B72}.ct-8311bd{color:#A5D6FF}.ct-df759b{color:#C9D1D9}.ct-be2779{color:#C9D1D9}.ct-d7619b{color:#FF7B72}.ct-d0cc10{color:#8B949E}.light .ct-d0cc10{color:#93A1A1}.light .ct-d7619b{color:#859900}.light .ct-be2779{color:#657B83}.light .ct-df759b{color:#268BD2}.light .ct-8311bd{color:#2AA198}.light .ct-bee573{color:#073642}.light .ct-fc1c1f{color:#268BD2}.light .ct-8273bb{color:#657B83}.light .ct-17e750{color:#268BD2}.light .ct-42aed1{color:#859900}.light .ct-72e938{color:#657B83}.light .ct-4fa542{color:#859900}.light .ct-e809ed{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-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 diff --git a/docs/api/_content/query/O9PBAkuWXG.json b/docs/api/_content/query/O9PBAkuWXG.json index 5cb702e..20d271a 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-dfa5ff"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"createApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"authorization"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e6fdf9"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"<"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" >,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"ApolloClientBase"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" link: "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"ApolloLink"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"(["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"setContext"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"HttpLink"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" uri: "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" fetch: "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ]),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"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-447e6a"},"children":[{"type":"text","value":"/** Global singleton for refreshing promise */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e6fdf9"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-e3665f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"<{ "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"ErrorCode"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" }>)"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"isArray"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"some"}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f0c5e"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"children":[{"type":"text","value":"// Distinguish unauthorized error here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-e3665f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0129f6"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"operationName"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e31246"},"children":[{"type":"text","value":"'RefreshToken'"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-dfa5ff"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0129f6"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" { accessToken: "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ) "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"Response"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e6fdf9"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":">)?."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0129f6"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e31246"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"async"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0129f6"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0129f6"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ok: "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950799"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e31246"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0864e2"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea037"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e31246"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d5c40d"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bce9e7"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-9870c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e29465"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e3665f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-440b61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9aa602"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-447e6a"},"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-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27d781"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-04ec2d"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dfa5ff"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-e31246"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-741a35"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e31246{color:#A5D6FF}.ct-0129f6{color:#79C0FF}.ct-8f0c5e{color:#79C0FF}.ct-950799{color:#FFA657}.ct-0864e2{color:#79C0FF}.ct-04ec2d{color:#C9D1D9}.ct-447e6a{color:#8B949E}.ct-e6fdf9{color:#FFA657}.ct-e3665f{color:#FF7B72}.ct-d5c40d{color:#D2A8FF}.ct-fea037{color:#79C0FF}.ct-e29465{color:#79C0FF}.ct-9870c8{color:#FF7B72}.ct-bce9e7{color:#FFA657}.ct-440b61{color:#C9D1D9}.ct-27d781{color:#D2A8FF}.ct-9aa602{color:#FF7B72}.ct-741a35{color:#C9D1D9}.ct-dfa5ff{color:#FF7B72}.light .ct-dfa5ff{color:#859900}.light .ct-741a35{color:#657B83}.light .ct-9aa602{color:#073642}.light .ct-27d781{color:#268BD2}.light .ct-440b61{color:#657B83}.light .ct-bce9e7{color:#657B83}.light .ct-9870c8{color:#859900}.light .ct-e29465{color:#859900}.light .ct-fea037{color:#859900}.light .ct-d5c40d{color:#268BD2}.light .ct-e3665f{color:#073642}.light .ct-e6fdf9{color:#268BD2}.light .ct-447e6a{color:#93A1A1}.light .ct-04ec2d{color:#268BD2}.light .ct-0864e2{color:#B58900}.light .ct-950799{color:#268BD2}.light .ct-8f0c5e{color:#D33682}.light .ct-0129f6{color:#268BD2}.light .ct-e31246{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-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 diff --git a/docs/api/_content/query/PwERR4vHv2.json b/docs/api/_content/query/PwERR4vHv2.json index 705fc54..058dfd6 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-536cc9"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-f689ea"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'react-native-app-auth'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-053d0a"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f15ee2"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" issuer: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'https://accounts.google.com'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}.apps.googleusercontent.com`"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"`com.yourapp:/oauth2redirect/google`"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'openid'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'profile'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-feeeca"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"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-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-053d0a"},"children":[{"type":"text","value":"// better hide it somehow"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'com.yourapp'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b9865f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536cc9"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f15ee2"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" serviceConfiguration: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" authorizationEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/authorize?response_type=code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}&redirect_uri=${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-053d0a"},"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-f8be4b"},"children":[{"type":"text","value":" tokenEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}&client_secret=${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-bfd1f5"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'login:info'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d5282b"},"children":[{"type":"text","value":"'login:avatar'"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-feeeca"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f15ee2"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f689ea"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-f689ea"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f8be4b"},"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-feeeca{color:#79C0FF}.ct-f15ee2{color:#D2A8FF}.ct-053d0a{color:#8B949E}.ct-bfd1f5{color:#79C0FF}.ct-b9865f{color:#FF7B72}.ct-d5282b{color:#A5D6FF}.ct-f689ea{color:#C9D1D9}.ct-f8be4b{color:#C9D1D9}.ct-536cc9{color:#FF7B72}.light .ct-536cc9{color:#859900}.light .ct-f8be4b{color:#657B83}.light .ct-f689ea{color:#268BD2}.light .ct-d5282b{color:#2AA198}.light .ct-b9865f{color:#073642}.light .ct-bfd1f5{color:#268BD2}.light .ct-053d0a{color:#93A1A1}.light .ct-f15ee2{color:#268BD2}.light .ct-feeeca{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-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 diff --git a/docs/api/_content/query/QqziXmSF9l.json b/docs/api/_content/query/QqziXmSF9l.json index a295211..9f47f7f 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-1350ad"},"children":[{"type":"text","value":"adb logcat com.application:I "}]},{"type":"element","tag":"span","props":{"class":"ct-65c5ba"},"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-1350ad"},"children":[{"type":"text","value":"keytool -printcert -jarfile "}]},{"type":"element","tag":"span","props":{"class":"ct-65c5ba"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-a8ce39"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-fa8b86"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-65c5ba"},"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-1350ad"},"children":[{"type":"text","value":"npx react-native bundle \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" --platform android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" --dev "}]},{"type":"element","tag":"span","props":{"class":"ct-9b5163"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" --entry-file index.js \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"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-1350ad"},"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-9b5163"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" android "}]},{"type":"element","tag":"span","props":{"class":"ct-369f62"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"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-cb124c"},"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-1350ad"},"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-9b5163"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" ./android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-369f62"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" ./gradlew assembleRelease \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-369f62"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"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-cb124c"},"children":[{"type":"text","value":"# ios "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":"xcrun simctl openurl booted "}]},{"type":"element","tag":"span","props":{"class":"ct-a8ce39"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-fa8b86"},"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-cb124c"},"children":[{"type":"text","value":"# android"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":"adb shell am start -W -a android.intent.action.VIEW -d "}]},{"type":"element","tag":"span","props":{"class":"ct-a8ce39"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-fa8b86"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"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-1350ad"},"children":[{"type":"text","value":"PACKAGE="}]},{"type":"element","tag":"span","props":{"class":"ct-65c5ba"},"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-1350ad"},"children":[{"type":"text","value":"adb shell pm set-app-links --package "}]},{"type":"element","tag":"span","props":{"class":"ct-a8ce39"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-fa8b86"},"children":[{"type":"text","value":"PACKAGE"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" 0 all "}]},{"type":"element","tag":"span","props":{"class":"ct-369f62"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1350ad"},"children":[{"type":"text","value":" adb shell pm verify-app-links --re-verify "}]},{"type":"element","tag":"span","props":{"class":"ct-a8ce39"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-fa8b86"},"children":[{"type":"text","value":"PACKAGE"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-cb124c{color:#8B949E}.ct-369f62{color:#FF7B72}.ct-9b5163{color:#79C0FF}.ct-fa8b86{color:#C9D1D9}.ct-a8ce39{color:#C9D1D9}.ct-65c5ba{color:#A5D6FF}.ct-1350ad{color:#C9D1D9}.light .ct-1350ad{color:#657B83}.light .ct-65c5ba{color:#2AA198}.light .ct-a8ce39{color:#859900}.light .ct-fa8b86{color:#268BD2}.light .ct-9b5163{color:#268BD2}.light .ct-369f62{color:#859900}.light .ct-cb124c{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-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 diff --git a/docs/api/_content/query/R77EQlrPEJ.json b/docs/api/_content/query/R77EQlrPEJ.json index bd96eaf..0fa137c 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-f70778"},"children":[{"type":"text","value":"// render-a-cube.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"./create-shader\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"./vertex.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"./fragment.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getElementyId"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getRenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"'webgl'"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// should be put inside requestAnimationFrame"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":")(); "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0aa98"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa7a76"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa7a76"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// Initializing viewport"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf159c"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"Can't init programm\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"VERTEX_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"FRAGMENT_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"linkProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getProgramParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"LINK_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf159c"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"Could not initialise shaders\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 3"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 4"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 5"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 7"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// side 0 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// side 0 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// side 1 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// side 1 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf159c"},"children":[{"type":"text","value":"Float32Array"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"STATIC_DRAW"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7def95"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf159c"},"children":[{"type":"text","value":"Uint16Array"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"STATIC_DRAW"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7def95"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// initial drawing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"enable"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"DEPTH_TEST"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"DEPTH_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vertexAttribPointer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"), "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 3 bytes-long"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"FLOAT"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7def95"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"enableVertexAttribArray"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0.01"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"useProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0.25"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"slide\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"\"aspect\""}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"squareIndexBuffer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"drawElements"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"TRIANGLES"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"indices"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"UNSIGNED_SHORT"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"+="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"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-f70778"},"children":[{"type":"text","value":"// create-shader.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0aa98"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa7a76"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-829027"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-5860fb"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa7a76"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-32680c"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f8eec0"},"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-37d28d"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf159c"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"`Can't init shader`"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"shaderSource"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"compileShader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getShaderParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"COMPILE_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24c8e4"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"getShaderInfoLog"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"`Could not compile WebGL program. "}]},{"type":"element","tag":"span","props":{"class":"ct-ab3506"},"children":[{"type":"text","value":"\\n\\n"}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-f78144"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"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-f70778"},"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-37d28d"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-f70778"},"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-37d28d"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"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-9662c5"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"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-37d28d"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"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-9662c5"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9662c5"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"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-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f70778"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-6df26c"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-48b53b"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e05c75"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-67a764"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d28d"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ab3506{color:#79C0FF}.ct-f8eec0{color:#8B949E}.ct-7def95{color:#79C0FF}.ct-cf159c{color:#79C0FF}.ct-67a764{color:#79C0FF}.ct-fa7a76{color:#79C0FF}.ct-b0aa98{color:#FFA657}.ct-5860fb{color:#FF7B72}.ct-829027{color:#FFA657}.ct-32680c{color:#C9D1D9}.ct-48b53b{color:#D2A8FF}.ct-24c8e4{color:#79C0FF}.ct-9662c5{color:#FF7B72}.ct-f78144{color:#A5D6FF}.ct-e05c75{color:#C9D1D9}.ct-37d28d{color:#C9D1D9}.ct-6df26c{color:#FF7B72}.ct-f70778{color:#8B949E}.light .ct-f70778{color:#93A1A1}.light .ct-6df26c{color:#859900}.light .ct-37d28d{color:#657B83}.light .ct-e05c75{color:#268BD2}.light .ct-f78144{color:#2AA198}.light .ct-9662c5{color:#073642}.light .ct-24c8e4{color:#268BD2}.light .ct-48b53b{color:#268BD2}.light .ct-32680c{color:#657B83}.light .ct-829027{color:#657B83}.light .ct-5860fb{color:#859900}.light .ct-b0aa98{color:#268BD2}.light .ct-fa7a76{color:#859900}.light .ct-67a764{color:#D33682}.light .ct-cf159c{color:#859900}.light .ct-7def95{color:#B58900}.light .ct-f8eec0{color:#93A1A1}.light .ct-ab3506{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-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 diff --git a/docs/api/_content/query/S7L9CBleOj.json b/docs/api/_content/query/S7L9CBleOj.json index 0f41f5b..8cf3af8 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-40e415"},"children":[{"type":"text","value":"// ~/server/plugins/highlight.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7fd0e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-55c159"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c7fd0e"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-55c159"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c7968a"},"children":[{"type":"text","value":"defineNitroPlugin"}]},{"type":"element","tag":"span","props":{"class":"ct-55c159"},"children":[{"type":"text","value":"((nitroApp) "}]},{"type":"element","tag":"span","props":{"class":"ct-42c01b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-55c159"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64c7a9"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"nitroApp"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"hooks"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a60195"},"children":[{"type":"text","value":"hook"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-230bb4"},"children":[{"type":"text","value":"\"content:file:beforeParse\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0dabf1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"_id"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a60195"},"children":[{"type":"text","value":"endsWith"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-230bb4"},"children":[{"type":"text","value":"\".md\""}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0dabf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-f6d93e"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a60195"},"children":[{"type":"text","value":"replace"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f7ba0"},"children":[{"type":"text","value":"/==("}]},{"type":"element","tag":"span","props":{"class":"ct-8e90cf"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-0dabf1"},"children":[{"type":"text","value":"^"}]},{"type":"element","tag":"span","props":{"class":"ct-8e90cf"},"children":[{"type":"text","value":"=]"}]},{"type":"element","tag":"span","props":{"class":"ct-0dabf1"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-5f7ba0"},"children":[{"type":"text","value":")==/"}]},{"type":"element","tag":"span","props":{"class":"ct-0dabf1"},"children":[{"type":"text","value":"gs"}]},{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-230bb4"},"children":[{"type":"text","value":"`$1`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f86631"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64c7a9"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-55c159"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-64c7a9"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-8e90cf{color:#79C0FF}.ct-5f7ba0{color:#A5D6FF}.ct-0dabf1{color:#FF7B72}.ct-230bb4{color:#A5D6FF}.ct-a60195{color:#D2A8FF}.ct-f6d93e{color:#C9D1D9}.ct-f86631{color:#C9D1D9}.ct-64c7a9{color:#C9D1D9}.ct-42c01b{color:#FF7B72}.ct-c7968a{color:#D2A8FF}.ct-55c159{color:#FFA657}.ct-c7fd0e{color:#FF7B72}.ct-40e415{color:#8B949E}.light .ct-40e415{color:#93A1A1}.light .ct-c7fd0e{color:#859900}.light .ct-55c159{color:#657B83}.light .ct-c7968a{color:#268BD2}.light .ct-42c01b{color:#073642}.light .ct-64c7a9{color:#657B83}.light .ct-f86631{color:#657B83}.light .ct-f6d93e{color:#268BD2}.light .ct-a60195{color:#268BD2}.light .ct-230bb4{color:#2AA198}.light .ct-0dabf1{color:#859900}.light .ct-5f7ba0{color:#D30102}.light .ct-8e90cf{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-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 diff --git a/docs/api/_content/query/SEkBVlx0jP.json b/docs/api/_content/query/SEkBVlx0jP.json index 1649cdc..0cf64bc 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-50be53"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2256ee"},"children":[{"type":"text","value":"'react'"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71d755"},"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-71d755"},"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-71d755"},"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-71d755"},"children":[{"type":"text","value":" */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10d630"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64a834"},"children":[{"type":"text","value":"useWhatsChanged"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-072d13"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-6b4fe7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d81651"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-f51b9a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f51b9a"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":">,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2256ee"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-10d630"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10d630"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ebf9df"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64a834"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64a834"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-10d630"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f51b9a"},"children":[{"type":"text","value":"Object"}]},{"type":"element","tag":"span","props":{"class":"ct-c40951"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6ba254"},"children":[{"type":"text","value":"entries"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"value"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-64a834"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2256ee"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-2256ee"},"children":[{"type":"text","value":"} ${"}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-2256ee"},"children":[{"type":"text","value":"} has changed`"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50be53"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c2aa86"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-957903"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-6ba254{color:#D2A8FF}.ct-ebf9df{color:#79C0FF}.ct-f51b9a{color:#79C0FF}.ct-d81651{color:#FFA657}.ct-6b4fe7{color:#FF7B72}.ct-072d13{color:#FFA657}.ct-c40951{color:#C9D1D9}.ct-64a834{color:#D2A8FF}.ct-10d630{color:#FF7B72}.ct-71d755{color:#8B949E}.ct-2256ee{color:#A5D6FF}.ct-c2aa86{color:#C9D1D9}.ct-957903{color:#C9D1D9}.ct-50be53{color:#FF7B72}.light .ct-50be53{color:#859900}.light .ct-957903{color:#657B83}.light .ct-c2aa86{color:#268BD2}.light .ct-2256ee{color:#2AA198}.light .ct-71d755{color:#93A1A1}.light .ct-10d630{color:#073642}.light .ct-64a834{color:#268BD2}.light .ct-c40951{color:#657B83}.light .ct-072d13{color:#657B83}.light .ct-6b4fe7{color:#859900}.light .ct-d81651{color:#268BD2}.light .ct-f51b9a{color:#859900}.light .ct-ebf9df{color:#268BD2}.light .ct-6ba254{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-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 diff --git a/docs/api/_content/query/TvYXYGXdZ0.json b/docs/api/_content/query/TvYXYGXdZ0.json index 0380cbd..fc4b3e1 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-d37555"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d37555"},"children":[{"type":"text","value":"sudo apt install mariadb-server"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d37555"},"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-d37555"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d37555"},"children":[{"type":"text","value":"bind-"}]},{"type":"element","tag":"span","props":{"class":"ct-161d77"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-d37555"},"children":[{"type":"text","value":" = 0.0.0.0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d37555"},"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-161d77{color:#FF7B72}.ct-d37555{color:#C9D1D9}.light .ct-d37555{color:#657B83}.light .ct-161d77{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-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 diff --git a/docs/api/_content/query/UBl6xR2vxQ.json b/docs/api/_content/query/UBl6xR2vxQ.json index 9c6ff75..93e1d6d 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-89fe6a"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"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-89fe6a"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"watchtower"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"children":[{"type":"text","value":"docker__watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"children":[{"type":"text","value":"v2tec/watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"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-4a670a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"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-4a670a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89fe6a"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-4a670a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-520d15"},"children":[{"type":"text","value":"--interval 60 image_1 image_2"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-520d15{color:#A5D6FF}.ct-4a670a{color:#C9D1D9}.ct-89fe6a{color:#7EE787}.light .ct-89fe6a{color:#268BD2}.light .ct-4a670a{color:#657B83}.light .ct-520d15{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-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 diff --git a/docs/api/_content/query/WJQDeZ21lK.json b/docs/api/_content/query/WJQDeZ21lK.json index ce64056..36f4eed 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-c2656d"},"children":[{"type":"text","value":"[alias]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" flush "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" git clean"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"branches branch "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"v master "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" xargs git branch "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"D"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" lol "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" log "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"oneline "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"graph"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" l "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" lol"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" c "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" cv "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"no"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"verify "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" push"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" pf "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"force"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"with"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"lease"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" ignore"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"now "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":" update"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"index "}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"children":[{"type":"text","value":"skip"}]},{"type":"element","tag":"span","props":{"class":"ct-108367"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-c2656d"},"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-108367{color:#FF7B72}.ct-c2656d{color:#C9D1D9}.light .ct-c2656d{color:#657B83}.light .ct-108367{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-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 diff --git a/docs/api/_content/query/WO7KYRkFiw.json b/docs/api/_content/query/WO7KYRkFiw.json index 34c09c3..f70670d 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-167112"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'web3-eth-contract'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ce6629"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"abi"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"object"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0359ef"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f83aa"},"children":[{"type":"text","value":"JSON"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0359ef"},"children":[{"type":"text","value":"parse"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-605c85"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-605c85"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-04e485"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// ABI of contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// address for contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ({}) "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// Calling write method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// authorizing with Metamask"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// getting wallet address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// current user's wallet"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5788b0"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'Parameter'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"send"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" from: "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3e375"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// calling read method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// this method can return data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"retrieve"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3e375"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-04e485"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// ABI контракта"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// contract address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// account's private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// write-methods requires private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ce6629"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"privateKeyToAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" to: "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"encodeABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" gas: "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"({ from: "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"signTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"rawTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"requests"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"balanceOf"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getStaked"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"call"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ce6629"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"any"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"[]) "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getWeb3NoAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"BatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"map"}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"add"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"execute"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3e375"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"all"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a60ae2"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-605c85"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-605c85"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'YOUR_RPC_ENDPOINT_HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'YOUR ABI HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'YOUR CONTRACT ADDRESS HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-78b2a1"},"children":[{"type":"text","value":"referralProgramContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"events"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"RegisterUser"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-ce6629"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5a3490"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"`| UserRegistered | events | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ed67f"},"children":[{"type":"text","value":"boolean"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e2e842"},"children":[{"type":"text","value":"RegisterUserResponseInterface"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-10950e"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"`| ONCE | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-ce6629"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5a3490"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-895378"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-3d4b19"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e2e842"},"children":[{"type":"text","value":"ErrnoException"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-6a6b94"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-08c842"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" value: [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-5788b0"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"events"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"Transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"str"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-5788b0"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" address: ["}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'address-1'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'address-2'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"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-f25d6a"},"children":[{"type":"text","value":" topics: [] "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"//What topics to subscribe to"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'logs'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"nr"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"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-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"//example options(optional)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-253c68"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-167112"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"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-f25d6a"},"children":[{"type":"text","value":" value: ["}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'1000'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'1337'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04e485"},"children":[{"type":"text","value":"// number | \"earliest\" | \"pending\" | \"latest\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-5788b0"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" toBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'latest'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"getPastEvents"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7ab707"},"children":[{"type":"text","value":"'Transfer'"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-78b2a1"},"children":[{"type":"text","value":"results"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-d8533d"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f25d6a"},"children":[{"type":"text","value":" "}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e2e842{color:#FFA657}.ct-5a3490{color:#A5D6FF}.ct-a60ae2{color:#79C0FF}.ct-a3e375{color:#79C0FF}.ct-5788b0{color:#79C0FF}.ct-10950e{color:#79C0FF}.ct-253c68{color:#FF7B72}.ct-04e485{color:#8B949E}.ct-605c85{color:#FFA657}.ct-d8533d{color:#D2A8FF}.ct-4f83aa{color:#79C0FF}.ct-0359ef{color:#79C0FF}.ct-1ed67f{color:#79C0FF}.ct-895378{color:#FFA657}.ct-3d4b19{color:#FF7B72}.ct-ce6629{color:#D2A8FF}.ct-08c842{color:#C9D1D9}.ct-6a6b94{color:#FF7B72}.ct-7ab707{color:#A5D6FF}.ct-78b2a1{color:#C9D1D9}.ct-f25d6a{color:#C9D1D9}.ct-167112{color:#FF7B72}.light .ct-167112{color:#859900}.light .ct-f25d6a{color:#657B83}.light .ct-78b2a1{color:#268BD2}.light .ct-7ab707{color:#2AA198}.light .ct-6a6b94{color:#073642}.light .ct-08c842{color:#657B83}.light .ct-ce6629{color:#268BD2}.light .ct-3d4b19{color:#859900}.light .ct-895378{color:#657B83}.light .ct-1ed67f{color:#859900}.light .ct-0359ef{color:#268BD2}.light .ct-4f83aa{color:#657B83}.light .ct-d8533d{color:#268BD2}.light .ct-605c85{color:#657B83}.light .ct-04e485{color:#93A1A1}.light .ct-253c68{color:#073642}.light .ct-10950e{color:#268BD2}.light .ct-5788b0{color:#D33682}.light .ct-a3e375{color:#859900}.light .ct-a60ae2{color:#B58900}.light .ct-5a3490{color:#2AA198}.light .ct-e2e842{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-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 diff --git a/docs/api/_content/query/WUiUHbO5Pg.json b/docs/api/_content/query/WUiUHbO5Pg.json index 65a3b5b..bc29843 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-52f331"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bb4c5e"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9a75fd"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-74b7be"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-52f331"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ede07a"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":": blur(5px);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"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-52f331"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-32e0cb"},"children":[{"type":"text","value":"can_backdrop"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-52f331"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-67fe3d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-b917d7"},"children":[{"type":"text","value":"-webkit-backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-67fe3d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-55cf6b"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-67fe3d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-29ab2f"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-a540fd"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-67fe3d"},"children":[{"type":"text","value":")) "}]},{"type":"element","tag":"span","props":{"class":"ct-f6c170"},"children":[{"type":"text","value":"or"}]},{"type":"element","tag":"span","props":{"class":"ct-67fe3d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bb4c5e"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9a75fd"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-74b7be"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-52f331"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-52f331"},"children":[{"type":"text","value":"@content"}]},{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0156f"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f6c170{color:#79C0FF}.ct-a540fd{color:#FF7B72}.ct-29ab2f{color:#79C0FF}.ct-55cf6b{color:#79C0FF}.ct-b917d7{color:#79C0FF}.ct-67fe3d{color:#C9D1D9}.ct-32e0cb{color:#D2A8FF}.ct-ede07a{color:#7EE787}.ct-74b7be{color:#79C0FF}.ct-9a75fd{color:#79C0FF}.ct-bb4c5e{color:#79C0FF}.ct-a0156f{color:#C9D1D9}.ct-52f331{color:#FF7B72}.light .ct-52f331{color:#859900}.light .ct-a0156f{color:#657B83}.light .ct-bb4c5e{color:#859900}.light .ct-9a75fd{color:#268BD2}.light .ct-74b7be{color:#D33682}.light .ct-ede07a{color:#268BD2}.light .ct-32e0cb{color:#268BD2}.light .ct-67fe3d{color:#657B83}.light .ct-b917d7{color:#859900}.light .ct-55cf6b{color:#268BD2}.light .ct-29ab2f{color:#D33682}.light .ct-a540fd{color:#859900}.light .ct-f6c170{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-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 diff --git a/docs/api/_content/query/XgydJZDPap.json b/docs/api/_content/query/XgydJZDPap.json index 734acca..3042b45 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-60f656"},"children":[{"type":"text","value":"Bluetooth: hci0: ACL packet "}]},{"type":"element","tag":"span","props":{"class":"ct-8a3611"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-60f656"},"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-de5892"},"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-60f656"},"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-60f656"},"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-60f656"},"children":[{"type":"text","value":"$ systool -v -m btusb "}]},{"type":"element","tag":"span","props":{"class":"ct-8a3611"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-60f656"},"children":[{"type":"text","value":" grep autosuspend"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60f656"},"children":[{"type":"text","value":" enable_autosuspend = "}]},{"type":"element","tag":"span","props":{"class":"ct-c38303"},"children":[{"type":"text","value":"\"N\""}]},{"type":"element","tag":"span","props":{"class":"ct-60f656"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-de5892"},"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-c38303{color:#A5D6FF}.ct-de5892{color:#8B949E}.ct-8a3611{color:#FF7B72}.ct-60f656{color:#C9D1D9}.light .ct-60f656{color:#657B83}.light .ct-8a3611{color:#859900}.light .ct-de5892{color:#93A1A1}.light .ct-c38303{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-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 diff --git a/docs/api/_content/query/a1s3E9iAyd.json b/docs/api/_content/query/a1s3E9iAyd.json index 23a046f..004ba2b 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-2861e4"},"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-7bd70d"},"children":[{"type":"text","value":"wait_for_mysql"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" query="}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\"SELECT count(*) FROM users\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-2861e4"},"children":[{"type":"text","value":"# 3 minutes limit"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-22d5e9"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" mysql --user="}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" -e "}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-5fb5de"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22d5e9"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":"\"[Error] can't properly query MySQL after "}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-51718e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5771f3"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-4bc028"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22d5e9"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afea19"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0bb3f2"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2861e4"},"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-5fb5de{color:#79C0FF}.ct-51718e{color:#C9D1D9}.ct-5771f3{color:#C9D1D9}.ct-22d5e9{color:#79C0FF}.ct-afea19{color:#FF7B72}.ct-4bc028{color:#A5D6FF}.ct-0bb3f2{color:#C9D1D9}.ct-7bd70d{color:#D2A8FF}.ct-2861e4{color:#8B949E}.light .ct-2861e4{color:#93A1A1}.light .ct-7bd70d{color:#268BD2}.light .ct-0bb3f2{color:#657B83}.light .ct-4bc028{color:#2AA198}.light .ct-afea19{color:#859900}.light .ct-22d5e9{color:#268BD2}.light .ct-5771f3{color:#859900}.light .ct-51718e{color:#268BD2}.light .ct-5fb5de{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-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 diff --git a/docs/api/_content/query/aP6pCxBj14.json b/docs/api/_content/query/aP6pCxBj14.json index ff2ff42..5213270 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-e908f9"},"children":[{"type":"text","value":"( screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-f06a18"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-e908f9"},"children":[{"type":"text","value":" ( screen -d bash "}]},{"type":"element","tag":"span","props":{"class":"ct-f06a18"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-e908f9"},"children":[{"type":"text","value":" screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-f06a18"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-e908f9"},"children":[{"type":"text","value":" screen -SAm bash bash ) )"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f06a18{color:#FF7B72}.ct-e908f9{color:#C9D1D9}.light .ct-e908f9{color:#657B83}.light .ct-f06a18{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-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 diff --git a/docs/api/_content/query/arOc40mIpI.json b/docs/api/_content/query/arOc40mIpI.json index 3090f72..b184088 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-9e0e5a"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-9e0e5a"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-9e0e5a"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"build-master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"plugins/docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"when"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"branch"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"dockerfile"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"Dockerfile"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"tag"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"${DRONE_BRANCH}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"global_docker_login"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"global_docker_password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"global_docker_registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"repo"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-9e0e5a"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-9e0e5a"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"drone"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"drone"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"drone/drone:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_RPC_SECRET=rpc_secret"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_SERVER_HOST=drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_SERVER_PROTO=https"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_TLS_AUTOCERT=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_GIT_ALWAYS_AUTH=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_LOGS_DEBUG=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"DRONE_LOGS_TRACE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"./data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"8090:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"drone-agent"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"drone__agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"drone/agent:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-84ac0e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e0e5a"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-84ac0e"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fa36ad"},"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-7970cc"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" DRONE_SERVER=https://drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7970cc"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" DRONE_TOKEN=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"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-84ac0e"},"children":[{"type":"text","value":"drone repo update "}]},{"type":"element","tag":"span","props":{"class":"ct-02d241"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0f697e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" --trusted=true "}]},{"type":"element","tag":"span","props":{"class":"ct-4462b4"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-84ac0e"},"children":[{"type":"text","value":" drone repo info "}]},{"type":"element","tag":"span","props":{"class":"ct-02d241"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0f697e"},"children":[{"type":"text","value":"1"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-4462b4{color:#FF7B72}.ct-0f697e{color:#C9D1D9}.ct-02d241{color:#C9D1D9}.ct-7970cc{color:#FF7B72}.ct-fa36ad{color:#A5D6FF}.ct-84ac0e{color:#C9D1D9}.ct-9e0e5a{color:#7EE787}.light .ct-9e0e5a{color:#268BD2}.light .ct-84ac0e{color:#657B83}.light .ct-fa36ad{color:#2AA198}.light .ct-7970cc{color:#073642}.light .ct-02d241{color:#859900}.light .ct-0f697e{color:#268BD2}.light .ct-4462b4{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-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 diff --git a/docs/api/_content/query/cft4lrDUKB.json b/docs/api/_content/query/cft4lrDUKB.json index 63dec84..e885f2c 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-cc550d"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-3d2392"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-3d2392"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-3d2392"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"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-3d2392"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-17c231"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3d2392"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"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-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-839dd2"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-3da093"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-17c231"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f2f3e"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-3f2f3e"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-3a2134"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cc550d"},"children":[{"type":"text","value":"}```"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-3a2134{color:#79C0FF}.ct-3f2f3e{color:#C9D1D9}.ct-3da093{color:#FF7B72}.ct-17c231{color:#D2A8FF}.ct-839dd2{color:#8B949E}.ct-3d2392{color:#FF7B72}.ct-cc550d{color:#C9D1D9}.light .ct-cc550d{color:#657B83}.light .ct-3d2392{color:#073642}.light .ct-839dd2{color:#93A1A1}.light .ct-17c231{color:#268BD2}.light .ct-3da093{color:#859900}.light .ct-3f2f3e{color:#268BD2}.light .ct-3a2134{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-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 diff --git a/docs/api/_content/query/eIcZslqPOz.json b/docs/api/_content/query/eIcZslqPOz.json index 519c6bf..5742962 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-497f82"},"children":[{"type":"text","value":"[url "}]},{"type":"element","tag":"span","props":{"class":"ct-d4cc90"},"children":[{"type":"text","value":"\"https://github.com\""}]},{"type":"element","tag":"span","props":{"class":"ct-497f82"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-497f82"},"children":[{"type":"text","value":" insteadOf "}]},{"type":"element","tag":"span","props":{"class":"ct-4318f3"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-497f82"},"children":[{"type":"text","value":" git:"}]},{"type":"element","tag":"span","props":{"class":"ct-3e3bdd"},"children":[{"type":"text","value":"//github.com"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-3e3bdd{color:#8B949E}.ct-4318f3{color:#FF7B72}.ct-d4cc90{color:#A5D6FF}.ct-497f82{color:#C9D1D9}.light .ct-497f82{color:#657B83}.light .ct-d4cc90{color:#2AA198}.light .ct-4318f3{color:#859900}.light .ct-3e3bdd{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-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 diff --git a/docs/api/_content/query/epeSDkttbj.json b/docs/api/_content/query/epeSDkttbj.json index 51264dc..269784f 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-497b4c"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fad650"},"children":[{"type":"text","value":"color-per-child"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-497b4c"},"children":[{"type":"text","value":"@each"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-497b4c"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a97837"},"children":[{"type":"text","value":"&"}]},{"type":"element","tag":"span","props":{"class":"ct-7ee002"},"children":[{"type":"text","value":":nth-child"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"#{"}]},{"type":"element","tag":"span","props":{"class":"ct-2cb513"},"children":[{"type":"text","value":"index"}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"(($colors), ($color))}"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c42099"},"children":[{"type":"text","value":"color"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-e4cb31"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-ad1209"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"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-85bf5a"},"children":[{"type":"text","value":".item"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0a2d2b"},"children":[{"type":"text","value":"@include"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d04bd4"},"children":[{"type":"text","value":"color_per_child"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-1605b9"},"children":[{"type":"text","value":"#ded187"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-1605b9"},"children":[{"type":"text","value":"#dbde87"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-1605b9"},"children":[{"type":"text","value":"#bade87"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-1605b9"},"children":[{"type":"text","value":"#9cde87"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-1605b9"},"children":[{"type":"text","value":"#87deaa"}]},{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5a2e29"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1605b9{color:#79C0FF}.ct-d04bd4{color:#D2A8FF}.ct-0a2d2b{color:#FF7B72}.ct-85bf5a{color:#79C0FF}.ct-5a2e29{color:#C9D1D9}.ct-c42099{color:#79C0FF}.ct-2cb513{color:#79C0FF}.ct-7ee002{color:#79C0FF}.ct-a97837{color:#7EE787}.ct-e4cb31{color:#FFA657}.ct-fad650{color:#D2A8FF}.ct-ad1209{color:#C9D1D9}.ct-497b4c{color:#FF7B72}.light .ct-497b4c{color:#859900}.light .ct-ad1209{color:#657B83}.light .ct-fad650{color:#268BD2}.light .ct-e4cb31{color:#657B83}.light .ct-a97837{color:#268BD2}.light .ct-7ee002{color:#93A1A1}.light .ct-2cb513{color:#268BD2}.light .ct-c42099{color:#859900}.light .ct-5a2e29{color:#657B83}.light .ct-85bf5a{color:#93A1A1}.light .ct-0a2d2b{color:#859900}.light .ct-d04bd4{color:#268BD2}.light .ct-1605b9{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-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 diff --git a/docs/api/_content/query/fXI9pPDQUP.json b/docs/api/_content/query/fXI9pPDQUP.json index c2d1a6a..4a39b3e 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-3137ef"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-42ebd0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-36c520"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-fa149d"},"children":[{"type":"text","value":"golang.org/x/text/language"}]},{"type":"element","tag":"span","props":{"class":"ct-36c520"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-42ebd0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-36c520"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-fa149d"},"children":[{"type":"text","value":"golang.org/x/text/message"}]},{"type":"element","tag":"span","props":{"class":"ct-36c520"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-944454"},"children":[{"type":"text","value":"lang"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3137ef"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" language."}]},{"type":"element","tag":"span","props":{"class":"ct-3ac2c4"},"children":[{"type":"text","value":"MustParse"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-54c85a"},"children":[{"type":"text","value":"ru-RU"}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-944454"},"children":[{"type":"text","value":"printer"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3137ef"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" message."}]},{"type":"element","tag":"span","props":{"class":"ct-3ac2c4"},"children":[{"type":"text","value":"NewPrinter"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"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-944454"},"children":[{"type":"text","value":"count"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3137ef"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-818c23"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":"printer."}]},{"type":"element","tag":"span","props":{"class":"ct-3ac2c4"},"children":[{"type":"text","value":"Sprintf"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-be627a"},"children":[{"type":"text","value":"%d"}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":" butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"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-44b132"},"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-44b132"},"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-44b132"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"message\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"translation\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"select\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"feature\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"plural\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"arg\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"cases\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"one\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} бабочка\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"few\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} бабочки\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"many\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} бабочек\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"other\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"{Count} бабочуль\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"placeholders\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"string\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"%[1]d\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"type\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"underlyingType\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"argNum\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-818c23"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f35525"},"children":[{"type":"text","value":"\"expr\""}]},{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3cfa3f"},"children":[{"type":"text","value":"\"count\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44b132"},"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-d9dfad"},"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-44b132"},"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-d9dfad{color:#8B949E}.ct-f35525{color:#79C0FF}.ct-be627a{color:#79C0FF}.ct-818c23{color:#79C0FF}.ct-54c85a{color:#FFA198}.ct-3cfa3f{color:#A5D6FF}.ct-3ac2c4{color:#79C0FF}.ct-944454{color:#C9D1D9}.ct-fa149d{color:#FFA657}.ct-36c520{color:#A5D6FF}.ct-42ebd0{color:#C9D1D9}.ct-44b132{color:#C9D1D9}.ct-3137ef{color:#FF7B72}.light .ct-3137ef{color:#859900}.light .ct-44b132{color:#657B83}.light .ct-42ebd0{color:#657B83}.light .ct-36c520{color:#2AA198}.light .ct-fa149d{color:#2AA198}.light .ct-944454{color:#268BD2}.light .ct-3ac2c4{color:#268BD2}.light .ct-3cfa3f{color:#2AA198}.light .ct-54c85a{color:#CD3131}.light .ct-818c23{color:#D33682}.light .ct-be627a{color:#CB4B16}.light .ct-f35525{color:#859900}.light .ct-d9dfad{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-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 diff --git a/docs/api/_content/query/gviYR2nAXj.json b/docs/api/_content/query/gviYR2nAXj.json index 536f659..d15a7c9 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-fcd093"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"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-fcd093"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"gitea"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fbbf51"},"children":[{"type":"text","value":"false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"gitea/gitea:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"USER_UID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"USER_GID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"./var/lib/gitea:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"./etc/gitea:/etc/gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"/etc/timezone:/etc/timezone:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"/etc/localtime:/etc/localtime:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcd093"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"\"3000:3000\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fa0ee5"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-a46b89"},"children":[{"type":"text","value":"\"222:22\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-fbbf51{color:#79C0FF}.ct-a46b89{color:#A5D6FF}.ct-fa0ee5{color:#C9D1D9}.ct-fcd093{color:#7EE787}.light .ct-fcd093{color:#268BD2}.light .ct-fa0ee5{color:#657B83}.light .ct-a46b89{color:#2AA198}.light .ct-fbbf51{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-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 diff --git a/docs/api/_content/query/iZIUw8pCoM.json b/docs/api/_content/query/iZIUw8pCoM.json index 04c00fb..f8d6030 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-d84b94"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d29147"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7f7efa"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-e5c636"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-939d0a"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c636"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-939d0a"},"children":[{"type":"text","value":"Bird"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-e5c636"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f7efa"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c636"},"children":[{"type":"text","value":"is"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-939d0a"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-8fe02f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-ba46a6"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-200008"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-ba46a6"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1d16bf"},"children":[{"type":"text","value":"undefined"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"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-6136c4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9e6c43"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0a066"},"children":[{"type":"text","value":"getSmallPet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e0a066"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ba46a6"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba46a6"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e0a066"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-a56ef8"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba46a6"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e0a066"},"children":[{"type":"text","value":"fly"}]},{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-37d612"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e0a066{color:#D2A8FF}.ct-9e6c43{color:#79C0FF}.ct-6136c4{color:#FF7B72}.ct-1d16bf{color:#79C0FF}.ct-200008{color:#FFA657}.ct-ba46a6{color:#C9D1D9}.ct-a56ef8{color:#FF7B72}.ct-37d612{color:#C9D1D9}.ct-939d0a{color:#FFA657}.ct-e5c636{color:#FF7B72}.ct-7f7efa{color:#FFA657}.ct-d29147{color:#D2A8FF}.ct-8fe02f{color:#C9D1D9}.ct-d84b94{color:#FF7B72}.light .ct-d84b94{color:#073642}.light .ct-8fe02f{color:#657B83}.light .ct-d29147{color:#268BD2}.light .ct-7f7efa{color:#657B83}.light .ct-e5c636{color:#859900}.light .ct-939d0a{color:#268BD2}.light .ct-37d612{color:#657B83}.light .ct-a56ef8{color:#859900}.light .ct-ba46a6{color:#268BD2}.light .ct-200008{color:#268BD2}.light .ct-1d16bf{color:#B58900}.light .ct-6136c4{color:#073642}.light .ct-9e6c43{color:#268BD2}.light .ct-e0a066{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-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 diff --git a/docs/api/_content/query/ki2hTtdZ9z.json b/docs/api/_content/query/ki2hTtdZ9z.json index c9b7f05..50438d2 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-097431"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0935dd"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"'./en.json'"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"typeof"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0935dd"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc0e15"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-33e71b"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-649304"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6035c6"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-649304"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ccbb6"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6035c6"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-649304"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7ccbb6"},"children":[{"type":"text","value":"TranslateOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2d18"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-bc0e15"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0935dd"},"children":[{"type":"text","value":"I18nLib"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-beca33"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-0935dd"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0935dd"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"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-5e35ff"},"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-5e35ff"},"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-097431"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e35ff"},"children":[{"type":"text","value":"// plural object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"''"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" { ["}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"-?:"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"]>> }["}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5e35ff"},"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-c6e64e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"'one'"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"'few'"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"'many'"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"}${''"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bab85e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"'.'}${"}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-b0dea2"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c6e64e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-9ff890"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-097431"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-9ebe25"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-0ab8ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-aa92c5"},"children":[{"type":"text","value":">];"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-bab85e{color:#A5D6FF}.ct-0ab8ab{color:#79C0FF}.ct-9ff890{color:#79C0FF}.ct-5e35ff{color:#8B949E}.ct-beca33{color:#D2A8FF}.ct-7ccbb6{color:#FFA657}.ct-6035c6{color:#FFA657}.ct-649304{color:#FF7B72}.ct-33e71b{color:#D2A8FF}.ct-7b2d18{color:#C9D1D9}.ct-bc0e15{color:#FF7B72}.ct-9ebe25{color:#FFA657}.ct-c6e64e{color:#FF7B72}.ct-b0dea2{color:#A5D6FF}.ct-0935dd{color:#C9D1D9}.ct-aa92c5{color:#C9D1D9}.ct-097431{color:#FF7B72}.light .ct-097431{color:#859900}.light .ct-aa92c5{color:#657B83}.light .ct-0935dd{color:#268BD2}.light .ct-b0dea2{color:#2AA198}.light .ct-c6e64e{color:#073642}.light .ct-9ebe25{color:#268BD2}.light .ct-bc0e15{color:#073642}.light .ct-7b2d18{color:#657B83}.light .ct-33e71b{color:#268BD2}.light .ct-649304{color:#859900}.light .ct-6035c6{color:#657B83}.light .ct-7ccbb6{color:#268BD2}.light .ct-beca33{color:#268BD2}.light .ct-5e35ff{color:#93A1A1}.light .ct-9ff890{color:#859900}.light .ct-0ab8ab{color:#D33682}.light .ct-bab85e{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-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 diff --git a/docs/api/_content/query/kmbybMtElx.json b/docs/api/_content/query/kmbybMtElx.json index 97771ab..60421d3 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-8ee6c5"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"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-8ee6c5"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"photoprism"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"photoprism__app"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"photoprism/photoprism:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"depends_on"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"mariadb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"2342:2342"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-23b72b"},"children":[{"type":"text","value":"# HTTP port (host:container)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_ADMIN_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"password\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"https://service.url/\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_ORIGINALS_LIMIT"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-1794c0"},"children":[{"type":"text","value":"5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_HTTP_COMPRESSION"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"gzip\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DEBUG"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_PUBLIC"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_READONLY"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_EXPERIMENTAL"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CHOWN"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_WEBDAV"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_SETTINGS"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_TENSORFLOW"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_FACES"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CLASSIFICATION"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DARKTABLE_PRESETS"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DETECT_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_UPLOAD_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"true\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_DRIVER"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_SERVER"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"mariadb:3306\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_NAME"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"photoprism\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"root\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"insecure\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_TITLE"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"PhotoPrism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_CAPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"Browse Your Life\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_DESCRIPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_AUTHOR"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"HOME"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"working_dir"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"./data/originals:/photoprism/originals\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"./data/imports:/photoprism/import\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"./data/storage:/photoprism/storage\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"mariadb"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"photoprism__db"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"mariadb:10.6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"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-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"\"./database:/var/lib/mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-23b72b"},"children":[{"type":"text","value":"# Important, don't remove"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"MYSQL_ROOT_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"insecure"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"MYSQL_DATABASE"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"MYSQL_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-8ee6c5"},"children":[{"type":"text","value":"MYSQL_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-b8000f"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0871da"},"children":[{"type":"text","value":"insecure"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1794c0{color:#79C0FF}.ct-23b72b{color:#8B949E}.ct-0871da{color:#A5D6FF}.ct-b8000f{color:#C9D1D9}.ct-8ee6c5{color:#7EE787}.light .ct-8ee6c5{color:#268BD2}.light .ct-b8000f{color:#657B83}.light .ct-0871da{color:#2AA198}.light .ct-23b72b{color:#93A1A1}.light .ct-1794c0{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-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 diff --git a/docs/api/_content/query/pVAGVLBNPu.json b/docs/api/_content/query/pVAGVLBNPu.json index f31e249..55da942 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-7a0e32"},"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-0e5f95"},"children":[{"type":"text","value":"PORT=22"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":"USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":"HOST=example.com"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":"REMOTE_PATH=/tmp"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":"REMOTE_FILE=sample.text"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"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-0e5f95"},"children":[{"type":"text","value":"rsync -a -e "}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\"ssh -p "}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"PORT"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":" -P -v \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"@"}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"HOST"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"REMOTE_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"REMOTE_FILE"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0e5f95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-117ea9"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4387dd"},"children":[{"type":"text","value":"DEST_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-e13a33"},"children":[{"type":"text","value":"\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-4387dd{color:#C9D1D9}.ct-117ea9{color:#C9D1D9}.ct-e13a33{color:#A5D6FF}.ct-0e5f95{color:#C9D1D9}.ct-7a0e32{color:#8B949E}.light .ct-7a0e32{color:#93A1A1}.light .ct-0e5f95{color:#657B83}.light .ct-e13a33{color:#2AA198}.light .ct-117ea9{color:#859900}.light .ct-4387dd{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-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 diff --git a/docs/api/_content/query/pv8ckH0an3.json b/docs/api/_content/query/pv8ckH0an3.json index 2806f89..3eb6880 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-c2fc37"},"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-6c2848"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f50258"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ab0ca"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"; }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-76f488"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-81f833"},"children":[{"type":"text","value":"SomeList"}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c154ca"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-c154ca"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" ({ "}]},{"type":"element","tag":"span","props":{"class":"ct-0e6a97"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-76f488"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-61c35b"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-61c35b"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2fc37"},"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-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-31f9cf"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0e6a97"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c154ca"},"children":[{"type":"text","value":"NativeSyntheticEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-c154ca"},"children":[{"type":"text","value":"NativeScrollEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":">) "}]},{"type":"element","tag":"span","props":{"class":"ct-76f488"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"nativeEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"contentOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"y"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-76f488"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8916ca"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-81f833"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-0e6a97"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dc23db"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-0e6a97"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-645c1b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-dc23db"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-76f488"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1cc538"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"scrollToOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" offset: "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" animated: "}]},{"type":"element","tag":"span","props":{"class":"ct-31f9cf"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2fc37"},"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-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"onInteraction"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-31f9cf"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-642fdb"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-61c35b"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f0e24c"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-6c2848"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-31f9cf"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-61c35b"},"children":[{"type":"text","value":"500"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"setSelectedSubThemes"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-ffb015"},"children":[{"type":"text","value":"FlatList"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2fc37"},"children":[{"type":"text","value":"// ...required FlatList options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-a011f1"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0cf5ac"},"children":[{"type":"text","value":"/>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8bf940"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ffb015{color:#FFA657}.ct-dc23db{color:#79C0FF}.ct-8916ca{color:#79C0FF}.ct-a011f1{color:#C9D1D9}.ct-31f9cf{color:#79C0FF}.ct-61c35b{color:#79C0FF}.ct-f0e24c{color:#79C0FF}.ct-0e6a97{color:#FFA657}.ct-c154ca{color:#FFA657}.ct-645c1b{color:#FF7B72}.ct-81f833{color:#D2A8FF}.ct-1cc538{color:#C9D1D9}.ct-76f488{color:#FF7B72}.ct-1ab0ca{color:#79C0FF}.ct-642fdb{color:#D2A8FF}.ct-0cf5ac{color:#FF7B72}.ct-f50258{color:#FFA657}.ct-8bf940{color:#C9D1D9}.ct-6c2848{color:#FF7B72}.ct-c2fc37{color:#8B949E}.light .ct-c2fc37{color:#93A1A1}.light .ct-6c2848{color:#073642}.light .ct-8bf940{color:#657B83}.light .ct-f50258{color:#268BD2}.light .ct-0cf5ac{color:#859900}.light .ct-642fdb{color:#268BD2}.light .ct-1ab0ca{color:#859900}.light .ct-76f488{color:#073642}.light .ct-1cc538{color:#657B83}.light .ct-81f833{color:#268BD2}.light .ct-645c1b{color:#859900}.light .ct-c154ca{color:#268BD2}.light .ct-0e6a97{color:#657B83}.light .ct-f0e24c{color:#268BD2}.light .ct-61c35b{color:#D33682}.light .ct-31f9cf{color:#B58900}.light .ct-a011f1{color:#268BD2}.light .ct-8916ca{color:#268BD2}.light .ct-dc23db{color:#859900}.light .ct-ffb015{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-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 diff --git a/docs/api/_content/query/rNRhET0KmZ.json b/docs/api/_content/query/rNRhET0KmZ.json index 94c7e08..1605267 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-e5c841"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"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-e5c841"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"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-e5c841"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"node:16"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"commands"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"yarn"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"yarn generate"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"rm -rf ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"mv ./.output/public ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"touch ./docs/.nojekyll"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"publish"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"plugins/gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"target_branch"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"children":[{"type":"text","value":"github_username"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e5c841"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-ede346"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6d06dc"},"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-6d06dc{color:#A5D6FF}.ct-ede346{color:#C9D1D9}.ct-e5c841{color:#7EE787}.light .ct-e5c841{color:#268BD2}.light .ct-ede346{color:#657B83}.light .ct-6d06dc{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-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 diff --git a/docs/api/_content/query/sxx5hHqDHF.json b/docs/api/_content/query/sxx5hHqDHF.json index b5c1d77..32e4d9c 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-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-c28caa"},"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-c28caa"},"children":[{"type":"text","value":"// application/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"app"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-c28caa"},"children":[{"type":"text","value":"shared"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"shared"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"driver"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c28caa"},"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-c28caa"},"children":[{"type":"text","value":"/// mailserver/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"mail"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-c28caa"},"children":[{"type":"text","value":"\"application_shared\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"application_shared"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bcc4"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-adc987"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-54130b"},"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-54130b{color:#79C0FF}.ct-c28caa{color:#A5D6FF}.ct-67bcc4{color:#7EE787}.ct-adc987{color:#C9D1D9}.light .ct-adc987{color:#657B83}.light .ct-67bcc4{color:#268BD2}.light .ct-c28caa{color:#2AA198}.light .ct-54130b{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-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 diff --git a/docs/api/_content/query/v8MG1Q8wMg.json b/docs/api/_content/query/v8MG1Q8wMg.json index b124f00..8f101fa 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-940413"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-940413"},"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-940413"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":"DUMP_PATH="}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":"CONTAINER="}]},{"type":"element","tag":"span","props":{"class":"ct-d23d5b"},"children":[{"type":"text","value":"\"db\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":"USER=root"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":"PASSWORD=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-022775"},"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-022775"},"children":[{"type":"text","value":"cat "}]},{"type":"element","tag":"span","props":{"class":"ct-d23d5b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"DUMP_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-d23d5b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8bc246"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-f598d7"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" -i "}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"CONTAINER"}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" mysql -u"}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" -p"}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-022775"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6bc133"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-25717c"},"children":[{"type":"text","value":"DB"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f598d7{color:#79C0FF}.ct-8bc246{color:#FF7B72}.ct-d23d5b{color:#A5D6FF}.ct-25717c{color:#C9D1D9}.ct-6bc133{color:#C9D1D9}.ct-022775{color:#C9D1D9}.ct-940413{color:#8B949E}.light .ct-940413{color:#93A1A1}.light .ct-022775{color:#657B83}.light .ct-6bc133{color:#859900}.light .ct-25717c{color:#268BD2}.light .ct-d23d5b{color:#2AA198}.light .ct-8bc246{color:#859900}.light .ct-f598d7{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-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 diff --git a/docs/api/_content/query/wOOxKhEEuc.json b/docs/api/_content/query/wOOxKhEEuc.json index 1e491cb..940ae2c 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-c8bb8b"},"children":[{"type":"text","value":"// main.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"Worker"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"'./render-worker.ts'"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"getElementById"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"children":[{"type":"text","value":"// attaching event listener to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04469e"},"children":[{"type":"text","value":"MessageEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af4150"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04469e"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ca9152"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ca9152"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"children":[{"type":"text","value":"// sending canvas contents to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"renderInCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"] })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"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-c8bb8b"},"children":[{"type":"text","value":"// render-worker.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2b7e1"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-6a09b8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2b7e1"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-6a09b8"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-2b5817"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-6a09b8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-60d6c0"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"message"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"instanceof"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-04469e"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af4150"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"'Received unknown data'"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"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-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"OffscreenCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dc610"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4f1418"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af4150"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c639cc"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ca9152"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ca9152"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"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-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"children":[{"type":"text","value":"// a couple of seconds"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"doHardRenderingStuffHere"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8bb8b"},"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-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-2a6009"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-333c44"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-bf026d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"] });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-560b2d"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-60d6c0{color:#C9D1D9}.ct-2b5817{color:#FF7B72}.ct-6a09b8{color:#FFA657}.ct-c2b7e1{color:#FF7B72}.ct-ca9152{color:#79C0FF}.ct-af4150{color:#79C0FF}.ct-04469e{color:#FFA657}.ct-bf026d{color:#C9D1D9}.ct-c639cc{color:#A5D6FF}.ct-333c44{color:#D2A8FF}.ct-4f1418{color:#FF7B72}.ct-5dc610{color:#79C0FF}.ct-560b2d{color:#C9D1D9}.ct-2a6009{color:#FF7B72}.ct-c8bb8b{color:#8B949E}.light .ct-c8bb8b{color:#93A1A1}.light .ct-2a6009{color:#073642}.light .ct-560b2d{color:#657B83}.light .ct-5dc610{color:#268BD2}.light .ct-4f1418{color:#859900}.light .ct-333c44{color:#268BD2}.light .ct-c639cc{color:#2AA198}.light .ct-bf026d{color:#268BD2}.light .ct-04469e{color:#268BD2}.light .ct-af4150{color:#859900}.light .ct-ca9152{color:#D33682}.light .ct-c2b7e1{color:#859900}.light .ct-6a09b8{color:#657B83}.light .ct-2b5817{color:#073642}.light .ct-60d6c0{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-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 diff --git a/docs/api/_content/query/xbO7aWQkpQ.json b/docs/api/_content/query/xbO7aWQkpQ.json index faab0be..88e597d 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-8699d9"},"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-e798c2"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"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-8699d9"},"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-e798c2"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-218838"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-218838"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"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-218838"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"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-e798c2"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"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-e798c2"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"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-e798c2"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8699d9"},"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-e798c2"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-06584e"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-638145"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-80c375"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e798c2"},"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-80c375{color:#79C0FF}.ct-06584e{color:#FF7B72}.ct-638145{color:#D2A8FF}.ct-218838{color:#FF7B72}.ct-e798c2{color:#C9D1D9}.ct-8699d9{color:#8B949E}.light .ct-8699d9{color:#93A1A1}.light .ct-e798c2{color:#657B83}.light .ct-218838{color:#073642}.light .ct-638145{color:#268BD2}.light .ct-06584e{color:#859900}.light .ct-80c375{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-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 diff --git a/docs/blockchain/common-typescript-examples/_payload.js b/docs/blockchain/common-typescript-examples/_payload.js index d76d596..b880030 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-4d811b"},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-dbcf14"},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-d68aa3{color:#79C0FF}.ct-dbcf14{color:#C9D1D9}.ct-f2dcb5{color:#79C0FF}.ct-5ce9b7{color:#A5D6FF}.ct-4d811b{color:#79C0FF}.ct-b0eabc{color:#FFA657}.ct-446270{color:#FF7B72}.ct-a35ac1{color:#D2A8FF}.ct-b083a6{color:#C9D1D9}.ct-940990{color:#FF7B72}.ct-06153f{color:#D2A8FF}.ct-ed33ff{color:#79C0FF}.ct-123e61{color:#FF7B72}.ct-41a6ec{color:#8B949E}.ct-e623ce{color:#A5D6FF}.ct-dde42d{color:#C9D1D9}.ct-20fec6{color:#C9D1D9}.ct-226c8e{color:#FF7B72}.light .ct-226c8e{color:#859900}.light .ct-20fec6{color:#657B83}.light .ct-dde42d{color:#268BD2}.light .ct-e623ce{color:#2AA198}.light .ct-41a6ec{color:#93A1A1}.light .ct-123e61{color:#073642}.light .ct-ed33ff{color:#268BD2}.light .ct-06153f{color:#268BD2}.light .ct-940990{color:#073642}.light .ct-b083a6{color:#657B83}.light .ct-a35ac1{color:#268BD2}.light .ct-446270{color:#859900}.light .ct-b0eabc{color:#657B83}.light .ct-4d811b{color:#859900}.light .ct-5ce9b7{color:#657B83}.light .ct-f2dcb5{color:#859900}.light .ct-dbcf14{color:#859900}.light .ct-d68aa3{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:1711020011608}}("element","span","text","ct-20fec6","line","ct-dde42d"," ",".","ct-226c8e","code","ct-06153f","ct-e623ce"," ","(","ct-123e61","","typescript","pre","web3",",","h2","=","const","ct-ed33ff","ct-b083a6"," {"," ",", ",2,"p"," ","utils","from","ct-41a6ec","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-940990","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-5ce9b7","ct-f2dcb5","window"," .","ct-d68aa3","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-a35ac1","getBalance","ct-446270","ct-b0eabc","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-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 diff --git a/docs/blockchain/common-typescript-examples/index.html b/docs/blockchain/common-typescript-examples/index.html index 7b32647..d779c81 100644 --- a/docs/blockchain/common-typescript-examples/index.html +++ b/docs/blockchain/common-typescript-examples/index.html @@ -2,5 +2,5 @@ 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 ce1c4fe..d48c002 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-4f83aa"},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-a60ae2"},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-e2e842{color:#FFA657}.ct-5a3490{color:#A5D6FF}.ct-a60ae2{color:#79C0FF}.ct-a3e375{color:#79C0FF}.ct-5788b0{color:#79C0FF}.ct-10950e{color:#79C0FF}.ct-253c68{color:#FF7B72}.ct-04e485{color:#8B949E}.ct-605c85{color:#FFA657}.ct-d8533d{color:#D2A8FF}.ct-4f83aa{color:#79C0FF}.ct-0359ef{color:#79C0FF}.ct-1ed67f{color:#79C0FF}.ct-895378{color:#FFA657}.ct-3d4b19{color:#FF7B72}.ct-ce6629{color:#D2A8FF}.ct-08c842{color:#C9D1D9}.ct-6a6b94{color:#FF7B72}.ct-7ab707{color:#A5D6FF}.ct-78b2a1{color:#C9D1D9}.ct-f25d6a{color:#C9D1D9}.ct-167112{color:#FF7B72}.light .ct-167112{color:#859900}.light .ct-f25d6a{color:#657B83}.light .ct-78b2a1{color:#268BD2}.light .ct-7ab707{color:#2AA198}.light .ct-6a6b94{color:#073642}.light .ct-08c842{color:#657B83}.light .ct-ce6629{color:#268BD2}.light .ct-3d4b19{color:#859900}.light .ct-895378{color:#657B83}.light .ct-1ed67f{color:#859900}.light .ct-0359ef{color:#268BD2}.light .ct-4f83aa{color:#657B83}.light .ct-d8533d{color:#268BD2}.light .ct-605c85{color:#657B83}.light .ct-04e485{color:#93A1A1}.light .ct-253c68{color:#073642}.light .ct-10950e{color:#268BD2}.light .ct-5788b0{color:#D33682}.light .ct-a3e375{color:#859900}.light .ct-a60ae2{color:#B58900}.light .ct-5a3490{color:#2AA198}.light .ct-e2e842{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:1711020011930}}("element","span","text","ct-f25d6a","line"," ","ct-78b2a1","ct-167112",".","ct-08c842","ct-d8533d","(","code","ct-253c68","ct-7ab707","=","ct-10950e","const"," "," ","ct-04e485","","typescript","pre"," {",");","p",";","ct-3d4b19","h3",", ","=\u003E","strong","web3","ct-6a6b94","log"," (","ct-895378","on",":"," { ","new","await","options"," ","console","ct-1ed67f","CONTRACT_ADDRESS","contract",",","))",3,"a","h2","getContract","e"," ","event"," .","Transfer","import"," } ","from","ct-ce6629",")","return","eth","catch",") {","Web3","subscription",2,"nofollow","gas","code-inline","ct-605c85","CONTRACT_ABI","try","ct-5788b0","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-a3e375"," }","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-0359ef","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-5a3490",", (","subscriptionId","}`","removed","returnValues","ct-e2e842","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-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 diff --git a/docs/blockchain/smart-contracts/index.html b/docs/blockchain/smart-contracts/index.html index 71a0527..05ae0c3 100644 --- a/docs/blockchain/smart-contracts/index.html +++ b/docs/blockchain/smart-contracts/index.html @@ -2,5 +2,5 @@ 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 6afa662..e007e2e 100644 --- a/docs/contacts/_payload.js +++ b/docs/contacts/_payload.js @@ -1 +1 @@ -export default {data:{},prerenderedAt:1711020005721} \ No newline at end of file +export default {data:{},prerenderedAt:1711020221326} \ No newline at end of file diff --git a/docs/contacts/index.html b/docs/contacts/index.html index 1bb3140..fb16653 100644 --- a/docs/contacts/index.html +++ b/docs/contacts/index.html @@ -2,5 +2,5 @@ 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 e08d4bc..02772c7 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-fadfc2"},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:"ct-ab1c70"},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-7df285{color:#8B949E}.ct-6def5a{color:#79C0FF}.ct-ab1c70{color:#FF7B72}.ct-fadfc2{color:#79C0FF}.ct-65bc06{color:#FFA657}.ct-88ce24{color:#79C0FF}.ct-99f92d{color:#79C0FF}.ct-5bf74e{color:#79C0FF}.ct-4ca3c1{color:#C9D1D9}.ct-228947{color:#79C0FF}.ct-e26c6a{color:#C9D1D9}.ct-500cf0{color:#FF7B72}.ct-c77f9d{color:#79C0FF}.ct-fc4738{color:#FFA657}.light .ct-fc4738{color:#657B83}.light .ct-c77f9d{color:#D33682}.light .ct-500cf0{color:#859900}.light .ct-e26c6a{color:#657B83}.light .ct-228947{color:#93A1A1}.light .ct-4ca3c1{color:#657B83}.light .ct-5bf74e{color:#859900}.light .ct-99f92d{color:#657B83}.light .ct-88ce24{color:#268BD2}.light .ct-65bc06{color:#657B83}.light .ct-fadfc2{color:#D33682}.light .ct-ab1c70{color:#859900}.light .ct-6def5a{color:#859900}.light .ct-7df285{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:1711020012141}}("element","span","text","ct-e26c6a","line","ct-4ca3c1","code","ct-c77f9d",": ",";"," ","","ct-6def5a","scss","pre"," ","h3","ct-500cf0","ct-228947","ct-5bf74e","}","ct-7df285","ct-65bc06","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-99f92d","2","; ",3,"Automatic Grid Like Masonry With Pure CSS","\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css","root","p","ct-fc4738","ct-88ce24","(",", ","$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-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 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 62dbdcf..a789fde 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 @@ -2,5 +2,5 @@ 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 e093565..9dbb50a 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-fad650"},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-a97837"},children:[{type:b,value:"&"}]},{type:a,tag:c,props:{class:"ct-7ee002"},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-2cb513"},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-c42099"},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-85bf5a"},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-0a2d2b"},children:[{type:b,value:"@include"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:"ct-d04bd4"},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-1605b9{color:#79C0FF}.ct-d04bd4{color:#D2A8FF}.ct-0a2d2b{color:#FF7B72}.ct-85bf5a{color:#79C0FF}.ct-5a2e29{color:#C9D1D9}.ct-c42099{color:#79C0FF}.ct-2cb513{color:#79C0FF}.ct-7ee002{color:#79C0FF}.ct-a97837{color:#7EE787}.ct-e4cb31{color:#FFA657}.ct-fad650{color:#D2A8FF}.ct-ad1209{color:#C9D1D9}.ct-497b4c{color:#FF7B72}.light .ct-497b4c{color:#859900}.light .ct-ad1209{color:#657B83}.light .ct-fad650{color:#268BD2}.light .ct-e4cb31{color:#657B83}.light .ct-a97837{color:#268BD2}.light .ct-7ee002{color:#93A1A1}.light .ct-2cb513{color:#268BD2}.light .ct-c42099{color:#859900}.light .ct-5a2e29{color:#657B83}.light .ct-85bf5a{color:#93A1A1}.light .ct-0a2d2b{color:#859900}.light .ct-d04bd4{color:#268BD2}.light .ct-1605b9{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:1711020012204}}("element","text","span","ct-ad1209","ct-5a2e29","line","code","ct-e4cb31",""," ","ct-1605b9","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-497b4c","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-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 diff --git a/docs/css/sass-nth-child-iterate-mixin/index.html b/docs/css/sass-nth-child-iterate-mixin/index.html index 64915b3..77399ee 100644 --- a/docs/css/sass-nth-child-iterate-mixin/index.html +++ b/docs/css/sass-nth-child-iterate-mixin/index.html @@ -2,5 +2,5 @@ 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 de6bbe7..9f68798 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-ede07a"},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-32e0cb"},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-b917d7"},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-55cf6b"},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:"ct-29ab2f"},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:"ct-a540fd"},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:")) "}]},{type:a,tag:c,props:{class:"ct-f6c170"},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-f6c170{color:#79C0FF}.ct-a540fd{color:#FF7B72}.ct-29ab2f{color:#79C0FF}.ct-55cf6b{color:#79C0FF}.ct-b917d7{color:#79C0FF}.ct-67fe3d{color:#C9D1D9}.ct-32e0cb{color:#D2A8FF}.ct-ede07a{color:#7EE787}.ct-74b7be{color:#79C0FF}.ct-9a75fd{color:#79C0FF}.ct-bb4c5e{color:#79C0FF}.ct-a0156f{color:#C9D1D9}.ct-52f331{color:#FF7B72}.light .ct-52f331{color:#859900}.light .ct-a0156f{color:#657B83}.light .ct-bb4c5e{color:#859900}.light .ct-9a75fd{color:#268BD2}.light .ct-74b7be{color:#D33682}.light .ct-ede07a{color:#268BD2}.light .ct-32e0cb{color:#268BD2}.light .ct-67fe3d{color:#657B83}.light .ct-b917d7{color:#859900}.light .ct-55cf6b{color:#268BD2}.light .ct-29ab2f{color:#D33682}.light .ct-a540fd{color:#859900}.light .ct-f6c170{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:1711020012250}}("element","text","span","ct-a0156f","line","code","ct-52f331","","ct-67fe3d","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-bb4c5e","ct-9a75fd","ct-74b7be"," ","}"," "," (",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-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 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 58c1a9a..7e0cda5 100644 --- a/docs/css/test-if-browser-supports-css-rules/index.html +++ b/docs/css/test-if-browser-supports-css-rules/index.html @@ -2,5 +2,5 @@ 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 ccb1294..a3263e2 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:1711020012312}}("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: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 diff --git a/docs/docker/building-static-pages-with-docker/index.html b/docs/docker/building-static-pages-with-docker/index.html index a55bdca..ecd964f 100644 --- a/docs/docker/building-static-pages-with-docker/index.html +++ b/docs/docker/building-static-pages-with-docker/index.html @@ -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 a4ba82b..04767c2 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-54130b"},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-54130b{color:#79C0FF}.ct-c28caa{color:#A5D6FF}.ct-67bcc4{color:#7EE787}.ct-adc987{color:#C9D1D9}.light .ct-adc987{color:#657B83}.light .ct-67bcc4{color:#268BD2}.light .ct-c28caa{color:#2AA198}.light .ct-54130b{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:1711020012345}}("element","text","span","code-inline","p","code","ct-adc987","line","",":","pre","ct-67bcc4","h3",".","strong","li","a","nofollow","yaml","ct-c28caa"," ",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-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 diff --git a/docs/docker/common-things-with-docker-mailserver/index.html b/docs/docker/common-things-with-docker-mailserver/index.html index 542166a..ca2db3b 100644 --- a/docs/docker/common-things-with-docker-mailserver/index.html +++ b/docs/docker/common-things-with-docker-mailserver/index.html @@ -2,7 +2,7 @@ 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 0396ede..331b9d8 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-4462b4"},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-4462b4{color:#FF7B72}.ct-0f697e{color:#C9D1D9}.ct-02d241{color:#C9D1D9}.ct-7970cc{color:#FF7B72}.ct-fa36ad{color:#A5D6FF}.ct-84ac0e{color:#C9D1D9}.ct-9e0e5a{color:#7EE787}.light .ct-9e0e5a{color:#268BD2}.light .ct-84ac0e{color:#657B83}.light .ct-fa36ad{color:#2AA198}.light .ct-7970cc{color:#073642}.light .ct-02d241{color:#859900}.light .ct-0f697e{color:#268BD2}.light .ct-4462b4{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:1711020012394}}("element","text","span","ct-84ac0e","line","ct-9e0e5a","ct-fa36ad","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-7970cc","export","ct-02d241","$","ct-0f697e")) \ 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-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 diff --git a/docs/docker/drone-ci/index.html b/docs/docker/drone-ci/index.html index 517b60a..2315e4c 100644 --- a/docs/docker/drone-ci/index.html +++ b/docs/docker/drone-ci/index.html @@ -2,5 +2,5 @@ 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 e95c9d0..bb5edaf 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-6d06dc{color:#A5D6FF}.ct-ede346{color:#C9D1D9}.ct-e5c841{color:#7EE787}.light .ct-e5c841{color:#268BD2}.light .ct-ede346{color:#657B83}.light .ct-6d06dc{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:1711020012453}}("element","text","span","ct-ede346","line","code-inline","ct-e5c841","ct-6d06dc","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-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 diff --git a/docs/docker/github-pages-with-drone-ci/index.html b/docs/docker/github-pages-with-drone-ci/index.html index bd56005..38f3980 100644 --- a/docs/docker/github-pages-with-drone-ci/index.html +++ b/docs/docker/github-pages-with-drone-ci/index.html @@ -2,5 +2,5 @@ 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 eb02873..0ae14a3 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-1380ba"},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-d1e433{color:#8B949E}.ct-65a7ad{color:#A5D6FF}.ct-e4a10d{color:#7EE787}.ct-1380ba{color:#FF7B72}.ct-70f0f3{color:#C9D1D9}.light .ct-70f0f3{color:#657B83}.light .ct-1380ba{color:#859900}.light .ct-e4a10d{color:#268BD2}.light .ct-65a7ad{color:#2AA198}.light .ct-d1e433{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:1711020012517}}("element","span","text","ct-70f0f3","line","ct-65a7ad","ct-e4a10d"," - ","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-d1e433"," \\")) \ 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-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 diff --git a/docs/docker/private-docker-registry/index.html b/docs/docker/private-docker-registry/index.html index 8187c4b..f5b496b 100644 --- a/docs/docker/private-docker-registry/index.html +++ b/docs/docker/private-docker-registry/index.html @@ -2,5 +2,5 @@ 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 2215182..248d592 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-520d15{color:#A5D6FF}.ct-4a670a{color:#C9D1D9}.ct-89fe6a{color:#7EE787}.light .ct-89fe6a{color:#268BD2}.light .ct-4a670a{color:#657B83}.light .ct-520d15{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:1711020012584}}("element","text","span","ct-4a670a","line","ct-89fe6a","ct-520d15","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-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 diff --git a/docs/docker/refresh-containers-on-pull/index.html b/docs/docker/refresh-containers-on-pull/index.html index 55919fc..8e3a4a6 100644 --- a/docs/docker/refresh-containers-on-pull/index.html +++ b/docs/docker/refresh-containers-on-pull/index.html @@ -2,5 +2,5 @@ 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 b6f8cb4..f20ceba 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-8bc246"},children:[{type:b,value:"|"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" docker "}]},{type:a,tag:c,props:{class:"ct-f598d7"},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-f598d7{color:#79C0FF}.ct-8bc246{color:#FF7B72}.ct-d23d5b{color:#A5D6FF}.ct-25717c{color:#C9D1D9}.ct-6bc133{color:#C9D1D9}.ct-022775{color:#C9D1D9}.ct-940413{color:#8B949E}.light .ct-940413{color:#93A1A1}.light .ct-022775{color:#657B83}.light .ct-6bc133{color:#859900}.light .ct-25717c{color:#268BD2}.light .ct-d23d5b{color:#2AA198}.light .ct-8bc246{color:#859900}.light .ct-f598d7{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:1711020012617}}("element","text","span","ct-022775","line","ct-6bc133","$","ct-25717c","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-940413","ct-d23d5b","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-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 diff --git a/docs/docker/seed-dump-inside-docker/index.html b/docs/docker/seed-dump-inside-docker/index.html index d469325..53e471a 100644 --- a/docs/docker/seed-dump-inside-docker/index.html +++ b/docs/docker/seed-dump-inside-docker/index.html @@ -2,5 +2,5 @@ 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 5166f17..e10469a 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-7bd70d"},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-5fb5de"},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-5fb5de{color:#79C0FF}.ct-51718e{color:#C9D1D9}.ct-5771f3{color:#C9D1D9}.ct-22d5e9{color:#79C0FF}.ct-afea19{color:#FF7B72}.ct-4bc028{color:#A5D6FF}.ct-0bb3f2{color:#C9D1D9}.ct-7bd70d{color:#D2A8FF}.ct-2861e4{color:#8B949E}.light .ct-2861e4{color:#93A1A1}.light .ct-7bd70d{color:#268BD2}.light .ct-0bb3f2{color:#657B83}.light .ct-4bc028{color:#2AA198}.light .ct-afea19{color:#859900}.light .ct-22d5e9{color:#268BD2}.light .ct-5771f3{color:#859900}.light .ct-51718e{color:#268BD2}.light .ct-5fb5de{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:1711020012649}}("element","span","text","ct-0bb3f2","line","ct-4bc028","ct-afea19","ct-5771f3","p","\"","ct-51718e"," ","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-2861e4","ct-22d5e9",";","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-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 diff --git a/docs/docker/wait-for-mysql/index.html b/docs/docker/wait-for-mysql/index.html index 67a79e9..2bcd225 100644 --- a/docs/docker/wait-for-mysql/index.html +++ b/docs/docker/wait-for-mysql/index.html @@ -2,5 +2,5 @@ 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 ca2249f..312c4d5 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-0b0467"},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-e756ed"},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-e756ed{color:#79C0FF}.ct-cf12d8{color:#C9D1D9}.ct-81100c{color:#C9D1D9}.ct-622801{color:#A5D6FF}.ct-c8e976{color:#79C0FF}.ct-5f7377{color:#FF7B72}.ct-c2b3a4{color:#C9D1D9}.ct-0b0467{color:#D2A8FF}.ct-b43981{color:#8B949E}.light .ct-b43981{color:#93A1A1}.light .ct-0b0467{color:#268BD2}.light .ct-c2b3a4{color:#657B83}.light .ct-5f7377{color:#859900}.light .ct-c8e976{color:#268BD2}.light .ct-622801{color:#2AA198}.light .ct-81100c{color:#859900}.light .ct-cf12d8{color:#268BD2}.light .ct-e756ed{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:1711020012688}}("element","span","text","ct-c2b3a4","line","ct-5f7377","ct-622801","ct-81100c"," ","p","ct-cf12d8","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-b43981","ct-c8e976","$",";","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-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 diff --git a/docs/docker/wait-for-redis/index.html b/docs/docker/wait-for-redis/index.html index 8b3ccd4..f8b6bef 100644 --- a/docs/docker/wait-for-redis/index.html +++ b/docs/docker/wait-for-redis/index.html @@ -2,5 +2,5 @@ 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 00c322d..bd77c67 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-feeeca{color:#79C0FF}.ct-f15ee2{color:#D2A8FF}.ct-053d0a{color:#8B949E}.ct-bfd1f5{color:#79C0FF}.ct-b9865f{color:#FF7B72}.ct-d5282b{color:#A5D6FF}.ct-f689ea{color:#C9D1D9}.ct-f8be4b{color:#C9D1D9}.ct-536cc9{color:#FF7B72}.light .ct-536cc9{color:#859900}.light .ct-f8be4b{color:#657B83}.light .ct-f689ea{color:#268BD2}.light .ct-d5282b{color:#2AA198}.light .ct-b9865f{color:#073642}.light .ct-bfd1f5{color:#268BD2}.light .ct-053d0a{color:#93A1A1}.light .ct-f15ee2{color:#268BD2}.light .ct-feeeca{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:1711020012724}}("element","text","span","ct-f8be4b","line"," ","ct-d5282b","ct-bfd1f5","ct-536cc9",",","code","p","a","ct-b9865f","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-f689ea","authorize","'...'","ct-053d0a","authState","ct-f15ee2","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-feeeca","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-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 diff --git a/docs/frontend/react-native/oauth2-login/index.html b/docs/frontend/react-native/oauth2-login/index.html index 3508ff3..9fa5fc6 100644 --- a/docs/frontend/react-native/oauth2-login/index.html +++ b/docs/frontend/react-native/oauth2-login/index.html @@ -2,5 +2,5 @@ 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 a9028fc..1d53e2d 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-f50258"},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-1ab0ca"},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-8916ca"},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-ffb015"},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-ffb015{color:#FFA657}.ct-dc23db{color:#79C0FF}.ct-8916ca{color:#79C0FF}.ct-a011f1{color:#C9D1D9}.ct-31f9cf{color:#79C0FF}.ct-61c35b{color:#79C0FF}.ct-f0e24c{color:#79C0FF}.ct-0e6a97{color:#FFA657}.ct-c154ca{color:#FFA657}.ct-645c1b{color:#FF7B72}.ct-81f833{color:#D2A8FF}.ct-1cc538{color:#C9D1D9}.ct-76f488{color:#FF7B72}.ct-1ab0ca{color:#79C0FF}.ct-642fdb{color:#D2A8FF}.ct-0cf5ac{color:#FF7B72}.ct-f50258{color:#FFA657}.ct-8bf940{color:#C9D1D9}.ct-6c2848{color:#FF7B72}.ct-c2fc37{color:#8B949E}.light .ct-c2fc37{color:#93A1A1}.light .ct-6c2848{color:#073642}.light .ct-8bf940{color:#657B83}.light .ct-f50258{color:#268BD2}.light .ct-0cf5ac{color:#859900}.light .ct-642fdb{color:#268BD2}.light .ct-1ab0ca{color:#859900}.light .ct-76f488{color:#073642}.light .ct-1cc538{color:#657B83}.light .ct-81f833{color:#268BD2}.light .ct-645c1b{color:#859900}.light .ct-c154ca{color:#268BD2}.light .ct-0e6a97{color:#657B83}.light .ct-f0e24c{color:#268BD2}.light .ct-61c35b{color:#D33682}.light .ct-31f9cf{color:#B58900}.light .ct-a011f1{color:#268BD2}.light .ct-8916ca{color:#268BD2}.light .ct-dc23db{color:#859900}.light .ct-ffb015{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:1711020012768}}("element","span","text","ct-8bf940","line"," ","ct-a011f1","ct-0cf5ac","ct-1cc538","=","."," "," ","ct-6c2848","current","ct-642fdb","=\u003E","const","ct-f0e24c","ct-645c1b"," {",";",":","ct-76f488","(",");"," ","}","code","ct-c2fc37","ct-c154ca","ct-0e6a97","ct-61c35b","scrollHeight","shouldKeepScrollPosition","ct-31f9cf","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-81f833","event"," },"," );","ct-dc23db","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-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 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 949b94b..310b033 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 @@ -2,5 +2,5 @@ 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 8008dc5..0a78360 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:1711020014644} \ 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:1711020228180} \ 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 5db6bed..278138d 100644 --- a/docs/frontend/react-native/react-native-app-auth/index.html +++ b/docs/frontend/react-native/react-native-app-auth/index.html @@ -2,5 +2,5 @@ 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 896fdda..6286c4b 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-cb124c{color:#8B949E}.ct-369f62{color:#FF7B72}.ct-9b5163{color:#79C0FF}.ct-fa8b86{color:#C9D1D9}.ct-a8ce39{color:#C9D1D9}.ct-65c5ba{color:#A5D6FF}.ct-1350ad{color:#C9D1D9}.light .ct-1350ad{color:#657B83}.light .ct-65c5ba{color:#2AA198}.light .ct-a8ce39{color:#859900}.light .ct-fa8b86{color:#268BD2}.light .ct-9b5163{color:#268BD2}.light .ct-369f62{color:#859900}.light .ct-cb124c{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:1711020012829}}("element","text","span","line","ct-1350ad","code","","pre","h2","shell",2,"li","a","nofollow","ct-a8ce39","$","ct-fa8b86","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-65c5ba","ct-369f62","&&",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-9b5163"," \\","ct-cb124c","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-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 diff --git a/docs/frontend/react-native/useful-comands/index.html b/docs/frontend/react-native/useful-comands/index.html index 19d7f1b..ce9a00f 100644 --- a/docs/frontend/react-native/useful-comands/index.html +++ b/docs/frontend/react-native/useful-comands/index.html @@ -2,5 +2,5 @@ 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 734aaa0..8d46379 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-50afea"},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-d3e13b"},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-0deb7f"},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-b58b07"},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-a8e7f4"},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-a8e7f4{color:#79C0FF}.ct-b58b07{color:#79C0FF}.ct-0deb7f{color:#A5D6FF}.ct-5aedf5{color:#8B949E}.ct-f099ac{color:#FFA657}.ct-1950bd{color:#79C0FF}.ct-90d7a6{color:#79C0FF}.ct-3d65cb{color:#FF7B72}.ct-a482ec{color:#D2A8FF}.ct-4ca53d{color:#79C0FF}.ct-e7668c{color:#FF7B72}.ct-0f7fe5{color:#FFA657}.ct-d3e13b{color:#79C0FF}.ct-50afea{color:#FFA657}.ct-64168b{color:#C9D1D9}.ct-37e1cc{color:#FF7B72}.ct-90c8db{color:#A5D6FF}.ct-e779cf{color:#C9D1D9}.ct-ed570f{color:#C9D1D9}.ct-bf76e7{color:#FF7B72}.light .ct-bf76e7{color:#859900}.light .ct-ed570f{color:#657B83}.light .ct-e779cf{color:#268BD2}.light .ct-90c8db{color:#2AA198}.light .ct-37e1cc{color:#073642}.light .ct-64168b{color:#657B83}.light .ct-50afea{color:#268BD2}.light .ct-d3e13b{color:#657B83}.light .ct-0f7fe5{color:#657B83}.light .ct-e7668c{color:#859900}.light .ct-4ca53d{color:#859900}.light .ct-a482ec{color:#268BD2}.light .ct-3d65cb{color:#073642}.light .ct-90d7a6{color:#859900}.light .ct-1950bd{color:#268BD2}.light .ct-f099ac{color:#268BD2}.light .ct-5aedf5{color:#93A1A1}.light .ct-0deb7f{color:#657B83}.light .ct-b58b07{color:#D33682}.light .ct-a8e7f4{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:1711020012862}}("element","span","text","ct-ed570f","line","ct-e779cf"," ","ct-bf76e7",".","ct-64168b","ct-a482ec"," ","ct-3d65cb",",",";"," ","="," {","=\u003E","const","ct-1950bd","(","ct-37e1cc","ct-0f7fe5"," ","return","axios","ct-90c8db","tokens",", ","client","error",":","ct-90d7a6",");"," ("," ","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-e7668c","string"," () ","refreshTokens","ct-5aedf5",") {","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-4ca53d","refresh","}","create","process","env","NEXT_PUBLIC_API_ENDPOINT","APIProvider","ct-f099ac","\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-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 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 0276289..3130cff 100644 --- a/docs/frontend/react/axios-refresh-token-on-react/index.html +++ b/docs/frontend/react/axios-refresh-token-on-react/index.html @@ -2,5 +2,5 @@ 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 8042cc7..c369894 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-24840b{color:#8B949E}.ct-d15e84{color:#D2A8FF}.ct-2ea340{color:#79C0FF}.ct-a500ef{color:#FF7B72}.ct-b24a29{color:#A5D6FF}.ct-c3b3b5{color:#C9D1D9}.ct-823297{color:#C9D1D9}.ct-842e6b{color:#FF7B72}.light .ct-842e6b{color:#859900}.light .ct-823297{color:#657B83}.light .ct-c3b3b5{color:#268BD2}.light .ct-b24a29{color:#2AA198}.light .ct-a500ef{color:#073642}.light .ct-2ea340{color:#268BD2}.light .ct-d15e84{color:#268BD2}.light .ct-24840b{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:1711020012936}}("element","span","text","ct-823297"," ","line","ct-842e6b","ct-c3b3b5","ct-a500ef","ct-d15e84",".","=","const"," ","ct-2ea340"," ","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-b24a29",";","();","=\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-24840b","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-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 diff --git a/docs/frontend/react/axios-with-abortcontroller/index.html b/docs/frontend/react/axios-with-abortcontroller/index.html index 7db21be..a0af907 100644 --- a/docs/frontend/react/axios-with-abortcontroller/index.html +++ b/docs/frontend/react/axios-with-abortcontroller/index.html @@ -2,5 +2,5 @@ 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 744560d..dc180b0 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-072d13"},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:"ct-6b4fe7"},children:[{type:c,value:":"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-d81651"},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-ebf9df"},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-6ba254"},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-6ba254{color:#D2A8FF}.ct-ebf9df{color:#79C0FF}.ct-f51b9a{color:#79C0FF}.ct-d81651{color:#FFA657}.ct-6b4fe7{color:#FF7B72}.ct-072d13{color:#FFA657}.ct-c40951{color:#C9D1D9}.ct-64a834{color:#D2A8FF}.ct-10d630{color:#FF7B72}.ct-71d755{color:#8B949E}.ct-2256ee{color:#A5D6FF}.ct-c2aa86{color:#C9D1D9}.ct-957903{color:#C9D1D9}.ct-50be53{color:#FF7B72}.light .ct-50be53{color:#859900}.light .ct-957903{color:#657B83}.light .ct-c2aa86{color:#268BD2}.light .ct-2256ee{color:#2AA198}.light .ct-71d755{color:#93A1A1}.light .ct-10d630{color:#073642}.light .ct-64a834{color:#268BD2}.light .ct-c40951{color:#657B83}.light .ct-072d13{color:#657B83}.light .ct-6b4fe7{color:#859900}.light .ct-d81651{color:#268BD2}.light .ct-f51b9a{color:#859900}.light .ct-ebf9df{color:#268BD2}.light .ct-6ba254{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:1711020012982}}("element","span","text","ct-957903","line","ct-c2aa86"," ","ct-50be53","ct-c40951","ct-2256ee","","code","ct-71d755","ct-10d630","ct-64a834","="," ","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-f51b9a","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-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 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 e708695..e71afd6 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 @@ -2,5 +2,5 @@ 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 059ac8c..a899d16 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:1711020014716} \ 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:1711020228209} \ 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 299a2c5..9143320 100644 --- a/docs/frontend/vue/add-global-variable-to-window/index.html +++ b/docs/frontend/vue/add-global-variable-to-window/index.html @@ -2,5 +2,5 @@ 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 00dbf30..40f443e 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-d0cc10"},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-df759b"},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-fc1c1f"},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-17e750"},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-72e938"},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-e809ed"},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-e809ed{color:#FF7B72}.ct-4fa542{color:#79C0FF}.ct-72e938{color:#FFA657}.ct-42aed1{color:#FF7B72}.ct-17e750{color:#D2A8FF}.ct-8273bb{color:#C9D1D9}.ct-fc1c1f{color:#FFA657}.ct-bee573{color:#FF7B72}.ct-8311bd{color:#A5D6FF}.ct-df759b{color:#C9D1D9}.ct-be2779{color:#C9D1D9}.ct-d7619b{color:#FF7B72}.ct-d0cc10{color:#8B949E}.light .ct-d0cc10{color:#93A1A1}.light .ct-d7619b{color:#859900}.light .ct-be2779{color:#657B83}.light .ct-df759b{color:#268BD2}.light .ct-8311bd{color:#2AA198}.light .ct-bee573{color:#073642}.light .ct-fc1c1f{color:#268BD2}.light .ct-8273bb{color:#657B83}.light .ct-17e750{color:#268BD2}.light .ct-42aed1{color:#859900}.light .ct-72e938{color:#657B83}.light .ct-4fa542{color:#859900}.light .ct-e809ed{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:1711020013035}}("element","text","span","ct-be2779","line"," ","ct-8273bb","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-bee573","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-d7619b","ct-8311bd"," {","ct-42aed1",":","ct-4fa542","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-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 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 d570639..755c19f 100644 --- a/docs/frontend/vue/adding-global-properties-to-component/index.html +++ b/docs/frontend/vue/adding-global-properties-to-component/index.html @@ -2,5 +2,5 @@ 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 45a410d..cfd664f 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-40e415"},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-c7968a"},children:[{type:b,value:"defineNitroPlugin"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"((nitroApp) "}]},{type:a,tag:c,props:{class:"ct-42c01b"},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-8e90cf{color:#79C0FF}.ct-5f7ba0{color:#A5D6FF}.ct-0dabf1{color:#FF7B72}.ct-230bb4{color:#A5D6FF}.ct-a60195{color:#D2A8FF}.ct-f6d93e{color:#C9D1D9}.ct-f86631{color:#C9D1D9}.ct-64c7a9{color:#C9D1D9}.ct-42c01b{color:#FF7B72}.ct-c7968a{color:#D2A8FF}.ct-55c159{color:#FFA657}.ct-c7fd0e{color:#FF7B72}.ct-40e415{color:#8B949E}.light .ct-40e415{color:#93A1A1}.light .ct-c7fd0e{color:#859900}.light .ct-55c159{color:#657B83}.light .ct-c7968a{color:#268BD2}.light .ct-42c01b{color:#073642}.light .ct-64c7a9{color:#657B83}.light .ct-f86631{color:#657B83}.light .ct-f6d93e{color:#268BD2}.light .ct-a60195{color:#268BD2}.light .ct-230bb4{color:#2AA198}.light .ct-0dabf1{color:#859900}.light .ct-5f7ba0{color:#D30102}.light .ct-8e90cf{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:1711020013073}}("element","text","span","ct-f86631","line","ct-f6d93e",".","ct-55c159"," ","ct-0dabf1","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-64c7a9","ct-a60195","(","ct-230bb4","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-c7fd0e","body"," ","ct-5f7ba0","ct-8e90cf",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-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 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 36d5795..e0cb152 100644 --- a/docs/frontend/vue/make-nuxt-handle-obsidian-highlights/index.html +++ b/docs/frontend/vue/make-nuxt-handle-obsidian-highlights/index.html @@ -2,5 +2,5 @@ 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 b964cfd..9be1800 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-f8eec0"},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-ab3506"},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-ab3506{color:#79C0FF}.ct-f8eec0{color:#8B949E}.ct-7def95{color:#79C0FF}.ct-cf159c{color:#79C0FF}.ct-67a764{color:#79C0FF}.ct-fa7a76{color:#79C0FF}.ct-b0aa98{color:#FFA657}.ct-5860fb{color:#FF7B72}.ct-829027{color:#FFA657}.ct-32680c{color:#C9D1D9}.ct-48b53b{color:#D2A8FF}.ct-24c8e4{color:#79C0FF}.ct-9662c5{color:#FF7B72}.ct-f78144{color:#A5D6FF}.ct-e05c75{color:#C9D1D9}.ct-37d28d{color:#C9D1D9}.ct-6df26c{color:#FF7B72}.ct-f70778{color:#8B949E}.light .ct-f70778{color:#93A1A1}.light .ct-6df26c{color:#859900}.light .ct-37d28d{color:#657B83}.light .ct-e05c75{color:#268BD2}.light .ct-f78144{color:#2AA198}.light .ct-9662c5{color:#073642}.light .ct-24c8e4{color:#268BD2}.light .ct-48b53b{color:#268BD2}.light .ct-32680c{color:#657B83}.light .ct-829027{color:#657B83}.light .ct-5860fb{color:#859900}.light .ct-b0aa98{color:#268BD2}.light .ct-fa7a76{color:#859900}.light .ct-67a764{color:#D33682}.light .ct-cf159c{color:#859900}.light .ct-7def95{color:#B58900}.light .ct-f8eec0{color:#93A1A1}.light .ct-ab3506{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:1711020013109}}("element","span","text","ct-37d28d","line","ct-e05c75",", "," ","ct-67a764","ct-6df26c","."," ","gl","ct-48b53b","(","ct-f70778"," ","1","ct-24c8e4",");","a","ct-9662c5","p","=","h2","ct-32680c","code","0","ct-f78144","strong","code-inline","Vertex Shaders","const","-","","Vertex%20Shaders","Fragment Shaders",";",",","prg",2,"nofollow","Fragment%20Shaders","pre"," ","indices"," (","shader","varyings"," and ","ct-829027","ct-5860fb",":","bindBuffer"," ","createShader","if","new","ct-cf159c","2","7","6","li","https:\u002F\u002Fopen.gl\u002F","Vertices","vertices","uniforms",").","typescript","Read more at ","c","width","ct-fa7a76","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-7def95","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-b0aa98","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-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 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 be6d25a..25dc03a 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 @@ -2,5 +2,5 @@ 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 03cbff5..332019b 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-3da093"},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-3a2134"},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-3a2134{color:#79C0FF}.ct-3f2f3e{color:#C9D1D9}.ct-3da093{color:#FF7B72}.ct-17c231{color:#D2A8FF}.ct-839dd2{color:#8B949E}.ct-3d2392{color:#FF7B72}.ct-cc550d{color:#C9D1D9}.light .ct-cc550d{color:#657B83}.light .ct-3d2392{color:#073642}.light .ct-839dd2{color:#93A1A1}.light .ct-17c231{color:#268BD2}.light .ct-3da093{color:#859900}.light .ct-3f2f3e{color:#268BD2}.light .ct-3a2134{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:1711020013313}}("element","text","span","ct-cc550d","line","ct-839dd2"," ","ct-3d2392","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-17c231","(","ct-3f2f3e")) \ 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-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 diff --git a/docs/frontend/webgl/fragment-shaders/index.html b/docs/frontend/webgl/fragment-shaders/index.html index 171b0b2..a3ae63c 100644 --- a/docs/frontend/webgl/fragment-shaders/index.html +++ b/docs/frontend/webgl/fragment-shaders/index.html @@ -2,5 +2,5 @@ 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 c3b224a..c523928 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-2b5817"},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-60d6c0"},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-60d6c0{color:#C9D1D9}.ct-2b5817{color:#FF7B72}.ct-6a09b8{color:#FFA657}.ct-c2b7e1{color:#FF7B72}.ct-ca9152{color:#79C0FF}.ct-af4150{color:#79C0FF}.ct-04469e{color:#FFA657}.ct-bf026d{color:#C9D1D9}.ct-c639cc{color:#A5D6FF}.ct-333c44{color:#D2A8FF}.ct-4f1418{color:#FF7B72}.ct-5dc610{color:#79C0FF}.ct-560b2d{color:#C9D1D9}.ct-2a6009{color:#FF7B72}.ct-c8bb8b{color:#8B949E}.light .ct-c8bb8b{color:#93A1A1}.light .ct-2a6009{color:#073642}.light .ct-560b2d{color:#657B83}.light .ct-5dc610{color:#268BD2}.light .ct-4f1418{color:#859900}.light .ct-333c44{color:#268BD2}.light .ct-c639cc{color:#2AA198}.light .ct-bf026d{color:#268BD2}.light .ct-04469e{color:#268BD2}.light .ct-af4150{color:#859900}.light .ct-ca9152{color:#D33682}.light .ct-c2b7e1{color:#859900}.light .ct-6a09b8{color:#657B83}.light .ct-2b5817{color:#073642}.light .ct-60d6c0{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:1711020013359}}("element","span","text","ct-560b2d","line"," ","ct-bf026d","ct-4f1418"," ","ct-333c44","(",".","p","ct-2a6009",");","=","data","code","ct-c8bb8b","const","ct-c639cc","canvas","ctx",", ","ct-5dc610","","new","highlight","a","nofollow","ImageBitmap","typescript","pre","=\u003E","if"," (","!"," }","ct-ca9152","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-04469e"," {",") {","throw","ct-af4150","Error","ct-6a09b8","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-c2b7e1","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-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 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 b8c3362..cd34351 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 @@ -2,5 +2,5 @@ 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 c2cc084..0b5ea90 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-80c375{color:#79C0FF}.ct-06584e{color:#FF7B72}.ct-638145{color:#D2A8FF}.ct-218838{color:#FF7B72}.ct-e798c2{color:#C9D1D9}.ct-8699d9{color:#8B949E}.light .ct-8699d9{color:#93A1A1}.light .ct-e798c2{color:#657B83}.light .ct-218838{color:#073642}.light .ct-638145{color:#268BD2}.light .ct-06584e{color:#859900}.light .ct-80c375{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:1711020013431}}("element","text","span","ct-e798c2","line","p","code-inline","a","ct-8699d9","ct-06584e","h2","li","highlight","ct-638145","ct-80c375","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-218838","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-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 diff --git a/docs/frontend/webgl/vertex-shaders/index.html b/docs/frontend/webgl/vertex-shaders/index.html index f7acad7..f35a637 100644 --- a/docs/frontend/webgl/vertex-shaders/index.html +++ b/docs/frontend/webgl/vertex-shaders/index.html @@ -2,5 +2,5 @@ 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 13b7520..58001df 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-d4cc90"},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-4318f3"},children:[{type:b,value:"="}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" git:"}]},{type:a,tag:c,props:{class:"ct-3e3bdd"},children:[{type:b,value:"\u002F\u002Fgithub.com"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-3e3bdd{color:#8B949E}.ct-4318f3{color:#FF7B72}.ct-d4cc90{color:#A5D6FF}.ct-497f82{color:#C9D1D9}.light .ct-497f82{color:#657B83}.light .ct-d4cc90{color:#2AA198}.light .ct-4318f3{color:#859900}.light .ct-3e3bdd{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:1711020013485}}("element","text","span","p","code","ct-497f82",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-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 diff --git a/docs/git/force-git-to-use-https/index.html b/docs/git/force-git-to-use-https/index.html index 8eadb19..bbcb79b 100644 --- a/docs/git/force-git-to-use-https/index.html +++ b/docs/git/force-git-to-use-https/index.html @@ -2,5 +2,5 @@ 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 81b3460..aa6e964 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-108367{color:#FF7B72}.ct-c2656d{color:#C9D1D9}.light .ct-c2656d{color:#657B83}.light .ct-108367{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:1711020013517}}("element","text","span","ct-c2656d",null,"td","ct-108367","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-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 diff --git a/docs/git/git-aliases-and-useful-commands/index.html b/docs/git/git-aliases-and-useful-commands/index.html index ae6b3d7..83b5746 100644 --- a/docs/git/git-aliases-and-useful-commands/index.html +++ b/docs/git/git-aliases-and-useful-commands/index.html @@ -2,5 +2,5 @@ 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 48a8118..5e5dfe2 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-54c85a"},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-be627a"},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-d9dfad"},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-d9dfad{color:#8B949E}.ct-f35525{color:#79C0FF}.ct-be627a{color:#79C0FF}.ct-818c23{color:#79C0FF}.ct-54c85a{color:#FFA198}.ct-3cfa3f{color:#A5D6FF}.ct-3ac2c4{color:#79C0FF}.ct-944454{color:#C9D1D9}.ct-fa149d{color:#FFA657}.ct-36c520{color:#A5D6FF}.ct-42ebd0{color:#C9D1D9}.ct-44b132{color:#C9D1D9}.ct-3137ef{color:#FF7B72}.light .ct-3137ef{color:#859900}.light .ct-44b132{color:#657B83}.light .ct-42ebd0{color:#657B83}.light .ct-36c520{color:#2AA198}.light .ct-fa149d{color:#2AA198}.light .ct-944454{color:#268BD2}.light .ct-3ac2c4{color:#268BD2}.light .ct-3cfa3f{color:#2AA198}.light .ct-54c85a{color:#CD3131}.light .ct-818c23{color:#D33682}.light .ct-be627a{color:#CB4B16}.light .ct-f35525{color:#859900}.light .ct-d9dfad{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:1711020013627}}("element","text","span","ct-44b132","line","code-inline","ct-f35525","code","p","ct-3cfa3f",": ","","a","nofollow","pre"," | ",","," ","h4","li",": {","\"","go","shell",".","https:\u002F\u002Fgithub.com\u002Fgolang\u002Ftext\u002Fblob\u002Fmaster\u002Ffeature\u002Fplural\u002Fgen_common.go#L19","ul","ct-3137ef","ct-36c520"," "," "," "," ","\"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-944454",":=","ct-3ac2c4"," },","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-42ebd0","ct-fa149d",")","(","'","ct-818c23","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-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 diff --git a/docs/golang/i18n-in-golang/index.html b/docs/golang/i18n-in-golang/index.html index aba789d..c2f0e53 100644 --- a/docs/golang/i18n-in-golang/index.html +++ b/docs/golang/i18n-in-golang/index.html @@ -2,5 +2,5 @@ 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 a27a69b..7fb1851 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-e9e1a3"},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-3ad0bb"},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-3ad0bb{color:#D2A8FF}.ct-186acb{color:#FF7B72}.ct-e9e1a3{color:#FFA657}.ct-42c786{color:#8B949E}.ct-2310f1{color:#79C0FF}.ct-302f13{color:#FF7B72}.ct-8211dc{color:#A5D6FF}.ct-5893ae{color:#C9D1D9}.ct-c1dd0b{color:#FF7B72}.ct-c4281e{color:#79C0FF}.ct-c7858e{color:#79C0FF}.ct-450d23{color:#FFA657}.ct-91b1ff{color:#C9D1D9}.ct-30ee11{color:#D2A8FF}.ct-684206{color:#C9D1D9}.ct-a8abaf{color:#FF7B72}.light .ct-a8abaf{color:#859900}.light .ct-684206{color:#657B83}.light .ct-30ee11{color:#268BD2}.light .ct-91b1ff{color:#657B83}.light .ct-450d23{color:#657B83}.light .ct-c7858e{color:#859900}.light .ct-c4281e{color:#859900}.light .ct-c1dd0b{color:#859900}.light .ct-5893ae{color:#268BD2}.light .ct-8211dc{color:#2AA198}.light .ct-302f13{color:#073642}.light .ct-2310f1{color:#268BD2}.light .ct-42c786{color:#93A1A1}.light .ct-e9e1a3{color:#268BD2}.light .ct-186acb{color:#073642}.light .ct-3ad0bb{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:1711020013740}}("element","span","text","ct-684206","line"," ","ct-a8abaf","ct-91b1ff","ct-5893ae","ct-42c786","code","ct-450d23"," "," ","code-inline","ct-c7858e","!","",": ","existing","||","p","pre",",","ct-c1dd0b"," ","?.",", "," {","items","totalCount","ct-8211dc","const","=","ApolloClient","typePolicies","typescript","mergeItemsWithTotalCount","ct-30ee11","ct-302f13","ct-2310f1"," ","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-c4281e","type","InMemoryCache",";","new","\u002F\u002F ..."," ","ct-186acb","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-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 diff --git a/docs/graphql/apollo-client-pagination/index.html b/docs/graphql/apollo-client-pagination/index.html index ce69859..316fbb8 100644 --- a/docs/graphql/apollo-client-pagination/index.html +++ b/docs/graphql/apollo-client-pagination/index.html @@ -2,5 +2,5 @@ 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 95b01ba..8ce3a89 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-8f0c5e"},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-e31246{color:#A5D6FF}.ct-0129f6{color:#79C0FF}.ct-8f0c5e{color:#79C0FF}.ct-950799{color:#FFA657}.ct-0864e2{color:#79C0FF}.ct-04ec2d{color:#C9D1D9}.ct-447e6a{color:#8B949E}.ct-e6fdf9{color:#FFA657}.ct-e3665f{color:#FF7B72}.ct-d5c40d{color:#D2A8FF}.ct-fea037{color:#79C0FF}.ct-e29465{color:#79C0FF}.ct-9870c8{color:#FF7B72}.ct-bce9e7{color:#FFA657}.ct-440b61{color:#C9D1D9}.ct-27d781{color:#D2A8FF}.ct-9aa602{color:#FF7B72}.ct-741a35{color:#C9D1D9}.ct-dfa5ff{color:#FF7B72}.light .ct-dfa5ff{color:#859900}.light .ct-741a35{color:#657B83}.light .ct-9aa602{color:#073642}.light .ct-27d781{color:#268BD2}.light .ct-440b61{color:#657B83}.light .ct-bce9e7{color:#657B83}.light .ct-9870c8{color:#859900}.light .ct-e29465{color:#859900}.light .ct-fea037{color:#859900}.light .ct-d5c40d{color:#268BD2}.light .ct-e3665f{color:#073642}.light .ct-e6fdf9{color:#268BD2}.light .ct-447e6a{color:#93A1A1}.light .ct-04ec2d{color:#268BD2}.light .ct-0864e2{color:#B58900}.light .ct-950799{color:#268BD2}.light .ct-8f0c5e{color:#D33682}.light .ct-0129f6{color:#268BD2}.light .ct-e31246{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:1711020013822}}("element","span","text","ct-741a35","line"," ","ct-440b61","ct-dfa5ff","ct-04ec2d","ct-27d781","ct-9aa602","=\u003E","(","ct-9870c8",":","ct-447e6a"," ","ct-bce9e7","ct-e3665f"," {","string","=",","," "," (","ct-e29465"," ",".","options","return","code"," ","ct-fea037"," ","const","async"," ","...","refreshingPromise","\u003C","headers",";","ct-950799"," () ","ct-d5c40d","refreshToken","Promise",") ","new","ct-0864e2","","isRefreshRequestOptions","errors","ct-0129f6",");","ct-e31246","!","||","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-e6fdf9","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-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 diff --git a/docs/graphql/refresh-token-in-apollo-client/index.html b/docs/graphql/refresh-token-in-apollo-client/index.html index bac9f16..88e6499 100644 --- a/docs/graphql/refresh-token-in-apollo-client/index.html +++ b/docs/graphql/refresh-token-in-apollo-client/index.html @@ -2,6 +2,6 @@ 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 cce1092..7539480 100644 --- a/docs/index.html +++ b/docs/index.html @@ -2,5 +2,5 @@ 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 685991d..2d22147 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){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:{},children:[{type:a,tag:i,props:{},children:[{type:b,value:J}]}]},{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:K},{type:a,tag:L,props:{},children:[{type:b,value:M}]},{type:b,value:N}]}]},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:f},children:[{type:a,tag:c,props:{class:O},children:[{type:b,value:P}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:"ct-98da3d"},children:[{type:b,value:"echo"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:Q}]},{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:e},children:[{type:b,value:Q}]},{type:a,tag:c,props:{class:"ct-f170fc"},children:[{type:b,value:"\u003E"}]},{type:a,tag:c,props:{class:e},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:R}]}]}]}]}]},{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:f},children:[{type:a,tag:c,props:{class:O},children:[{type:b,value:P}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},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:R}]}]}]}]}]},{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:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"certbot certonly \\"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --preferred-challenges=http --manual \\"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:S}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --manual-cleanup-hook \u002Foath\u002Fto\u002Fclean.sh "}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" -d "}]},{type:a,tag:c,props:{class:"ct-a8b618"},children:[{type:b,value:"\"vault48.org,*.vault48.org\""}]},{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:" --manual-public-ip-logging-ok"}]}]}]}]}]},{type:a,tag:h,props:{},children:[{type:a,tag:i,props:{},children:[{type:b,value:J}]}]},{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:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"certbot renew --manual-public-ip-logging-ok \\"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:S}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --manual-cleanup-hook \u002Fpath\u002Fto\u002Fclean.sh"}]}]}]}]}]},{type:a,tag:l,props:{},children:[{type:b,value:K},{type:a,tag:L,props:{},children:[{type:b,value:M}]},{type:b,value:N}]},{type:a,tag:"style",children:[{type:b,value:".ct-a8b618{color:#A5D6FF}.ct-f170fc{color:#FF7B72}.ct-698d1a{color:#C9D1D9}.ct-f42651{color:#C9D1D9}.ct-83c20d{color:#C9D1D9}.ct-98da3d{color:#79C0FF}.ct-a4046e{color:#8B949E}.light .ct-a4046e{color:#93A1A1}.light .ct-98da3d{color:#268BD2}.light .ct-83c20d{color:#657B83}.light .ct-f42651{color:#859900}.light .ct-698d1a{color:#268BD2}.light .ct-f170fc{color:#859900}.light .ct-a8b618{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:1711020013961}}("element","text","span","code","ct-83c20d","line","","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 \"vault48.org,*.vault48.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","ct-f42651","$","ct-698d1a","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:","Renewal script itself to put it in crontab","Don't forget to configure your http server to serve ","code-inline",".well-known",".","ct-a4046e","#!\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-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 diff --git a/docs/linux/certbot-well-known-auto-renew/index.html b/docs/linux/certbot-well-known-auto-renew/index.html index b0f6ed8..9e53592 100644 --- a/docs/linux/certbot-well-known-auto-renew/index.html +++ b/docs/linux/certbot-well-known-auto-renew/index.html @@ -2,5 +2,5 @@ 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 "vault48.org,*.vault48.org" \  --manual-public-ip-logging-ok
  1. Renewal script itself to put it in crontab
certbot renew --manual-public-ip-logging-ok \  --manual-auth-hook /path/to/auth.sh \  --manual-cleanup-hook /path/to/clean.sh

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 6b2fa99..847f4c1 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-768396"},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-460440"},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-460440{color:#A5D6FF}.ct-768396{color:#C9D1D9}.ct-33f343{color:#C9D1D9}.ct-731f9c{color:#FF7B72}.light .ct-731f9c{color:#859900}.light .ct-33f343{color:#657B83}.light .ct-768396{color:#268BD2}.light .ct-460440{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:1711020014012}}("element","text","span","ct-33f343","ct-731f9c"," ","","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-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 diff --git a/docs/linux/find-out-who-uses-swap/index.html b/docs/linux/find-out-who-uses-swap/index.html index 5a73296..7769c7c 100644 --- a/docs/linux/find-out-who-uses-swap/index.html +++ b/docs/linux/find-out-who-uses-swap/index.html @@ -2,5 +2,5 @@ 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 e38a7e4..99c614c 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-c38303"},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-c38303{color:#A5D6FF}.ct-de5892{color:#8B949E}.ct-8a3611{color:#FF7B72}.ct-60f656{color:#C9D1D9}.light .ct-60f656{color:#657B83}.light .ct-8a3611{color:#859900}.light .ct-de5892{color:#93A1A1}.light .ct-c38303{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:1711020014042}}("element","text","span","code","li","a","nofollow","","p","shell","pre","ct-60f656","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-8a3611","ct-de5892")) \ 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-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 diff --git a/docs/linux/fixing-lagging-usb-headphones/index.html b/docs/linux/fixing-lagging-usb-headphones/index.html index a017be3..198449f 100644 --- a/docs/linux/fixing-lagging-usb-headphones/index.html +++ b/docs/linux/fixing-lagging-usb-headphones/index.html @@ -2,5 +2,5 @@ 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 485ff16..1427275 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-fbbf51"},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-fbbf51{color:#79C0FF}.ct-a46b89{color:#A5D6FF}.ct-fa0ee5{color:#C9D1D9}.ct-fcd093{color:#7EE787}.light .ct-fcd093{color:#268BD2}.light .ct-fa0ee5{color:#657B83}.light .ct-a46b89{color:#2AA198}.light .ct-fbbf51{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:1711020014075}}("element","span","text","ct-fa0ee5","line","ct-fcd093","ct-a46b89"," - ",":"," ","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-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 diff --git a/docs/linux/gitea-for-git-hosting/index.html b/docs/linux/gitea-for-git-hosting/index.html index 1a27d89..d2ae235 100644 --- a/docs/linux/gitea-for-git-hosting/index.html +++ b/docs/linux/gitea-for-git-hosting/index.html @@ -2,5 +2,5 @@ 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 13025ff..cf88b23 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-1794c0"},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-1794c0{color:#79C0FF}.ct-23b72b{color:#8B949E}.ct-0871da{color:#A5D6FF}.ct-b8000f{color:#C9D1D9}.ct-8ee6c5{color:#7EE787}.light .ct-8ee6c5{color:#268BD2}.light .ct-b8000f{color:#657B83}.light .ct-0871da{color:#2AA198}.light .ct-23b72b{color:#93A1A1}.light .ct-1794c0{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:1711020014105}}("element","span","text","ct-b8000f","line","ct-8ee6c5","ct-0871da",": "," ","\"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-23b72b","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-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 diff --git a/docs/linux/google-photos-alternative-with-photoprism/index.html b/docs/linux/google-photos-alternative-with-photoprism/index.html index 90e19ad..90dd9cf 100644 --- a/docs/linux/google-photos-alternative-with-photoprism/index.html +++ b/docs/linux/google-photos-alternative-with-photoprism/index.html @@ -2,5 +2,5 @@ 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 2c21b29..4d5a0aa 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:1711020014159}}("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: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 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 8915589..75db3a1 100644 --- a/docs/linux/linux-on-asus-zenbook-um3402-ya/index.html +++ b/docs/linux/linux-on-asus-zenbook-um3402-ya/index.html @@ -2,5 +2,5 @@ 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 deb5144..36288fd 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-f06a18{color:#FF7B72}.ct-e908f9{color:#C9D1D9}.light .ct-e908f9{color:#657B83}.light .ct-f06a18{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:1711020014187}}("element","text","span","code","ct-e908f9",false,"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","","ct-f06a18","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-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 diff --git a/docs/linux/resume-or-start-screen-session/index.html b/docs/linux/resume-or-start-screen-session/index.html index f8875cf..046b134 100644 --- a/docs/linux/resume-or-start-screen-session/index.html +++ b/docs/linux/resume-or-start-screen-session/index.html @@ -2,5 +2,5 @@ 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 bf54ae6..b795b69 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-7a0e32"},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-4387dd{color:#C9D1D9}.ct-117ea9{color:#C9D1D9}.ct-e13a33{color:#A5D6FF}.ct-0e5f95{color:#C9D1D9}.ct-7a0e32{color:#8B949E}.light .ct-7a0e32{color:#93A1A1}.light .ct-0e5f95{color:#657B83}.light .ct-e13a33{color:#2AA198}.light .ct-117ea9{color:#859900}.light .ct-4387dd{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:1711020014209}}("element","span","text","line","ct-0e5f95","ct-e13a33","ct-117ea9","$","ct-4387dd","\"","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-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 diff --git a/docs/linux/rsync-file-with-ssh/index.html b/docs/linux/rsync-file-with-ssh/index.html index 4f6e194..c7cc193 100644 --- a/docs/linux/rsync-file-with-ssh/index.html +++ b/docs/linux/rsync-file-with-ssh/index.html @@ -2,5 +2,5 @@ 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 5eecb7e..e53a459 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-69a976"},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-e5b314"},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-1f2125{color:#C9D1D9}.ct-169d1e{color:#C9D1D9}.ct-e5b314{color:#79C0FF}.ct-916141{color:#FF7B72}.ct-69a976{color:#FF7B72}.ct-6611e9{color:#FFA657}.ct-4d0cda{color:#FF7B72}.ct-9ce8b7{color:#C9D1D9}.ct-8181f4{color:#8B949E}.ct-908dfd{color:#C9D1D9}.ct-61321c{color:#FF7B72}.light .ct-61321c{color:#073642}.light .ct-908dfd{color:#657B83}.light .ct-8181f4{color:#93A1A1}.light .ct-9ce8b7{color:#657B83}.light .ct-4d0cda{color:#073642}.light .ct-6611e9{color:#657B83}.light .ct-69a976{color:#657B83}.light .ct-916141{color:#859900}.light .ct-e5b314{color:#D33682}.light .ct-169d1e{color:#859900}.light .ct-1f2125{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:1711020014263}}("element","span","text","ct-908dfd","line","ct-916141"," ","code"," ","","ct-8181f4","h2","nginx","pre","code-inline","ct-9ce8b7"," ",2,"https:\u002F\u002Fnext.vault48.org","ct-61321c","server"," {","# ...","}","ct-169d1e","$","ct-1f2125",";",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-4d0cda","location","ct-6611e9","\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-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 diff --git a/docs/linux/setting-up-nginx/index.html b/docs/linux/setting-up-nginx/index.html index 2e4e213..d01a4f9 100644 --- a/docs/linux/setting-up-nginx/index.html +++ b/docs/linux/setting-up-nginx/index.html @@ -2,6 +2,6 @@ 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 c30a595..6f36872 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:1711020014316}}("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: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 diff --git a/docs/linux/ssh/index.html b/docs/linux/ssh/index.html index c286bef..ff65c70 100644 --- a/docs/linux/ssh/index.html +++ b/docs/linux/ssh/index.html @@ -6,5 +6,5 @@ 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/obsidian/self-hosted-obsidian-sync-with-couchdb/_payload.js b/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/_payload.js index 8a5c584..1b62a58 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-617671"},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-2fec91"},children:[{type:b,value:"location"}]},{type:a,tag:c,props:{class:M},children:[{type:b,value:au}]},{type:a,tag:c,props:{class:"ct-4e8335"},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-4e8335{color:#FFA657}.ct-2fec91{color:#FF7B72}.ct-e2d51b{color:#C9D1D9}.ct-05944b{color:#8B949E}.ct-564319{color:#C9D1D9}.ct-e436df{color:#C9D1D9}.ct-617671{color:#79C0FF}.ct-5e81bc{color:#FF7B72}.ct-a6ec15{color:#FF7B72}.ct-1bc9e9{color:#A5D6FF}.ct-25677f{color:#C9D1D9}.ct-8fdecd{color:#7EE787}.light .ct-8fdecd{color:#268BD2}.light .ct-25677f{color:#657B83}.light .ct-1bc9e9{color:#2AA198}.light .ct-a6ec15{color:#073642}.light .ct-5e81bc{color:#859900}.light .ct-617671{color:#D33682}.light .ct-e436df{color:#859900}.light .ct-564319{color:#268BD2}.light .ct-05944b{color:#93A1A1}.light .ct-e2d51b{color:#657B83}.light .ct-2fec91{color:#073642}.light .ct-4e8335{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:1711020014353}}("element","text","span","ct-25677f","line","ct-5e81bc","code-inline","li","code",":","ct-8fdecd","ct-1bc9e9",""," "," ","p","pre"," - ","ct-e436df","$","ct-564319"," ","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-e2d51b"," 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-a6ec15","server"," {"," server_name ","couchdb.yourhost.com;"," ","host","}","ct-05944b","# 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-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 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 11d5dc3..6094c35 100644 --- a/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/index.html +++ b/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/index.html @@ -2,7 +2,7 @@ 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 16c088b..0729274 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-161d77"},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-161d77{color:#FF7B72}.ct-d37555{color:#C9D1D9}.light .ct-d37555{color:#657B83}.light .ct-161d77{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:1711020014406}}("element","text","code","span","","pre","code-inline","line",2,"ct-d37555","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-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 diff --git a/docs/sql/mysql-and-mariadb-setup/index.html b/docs/sql/mysql-and-mariadb-setup/index.html index 9eb77bb..4b9282f 100644 --- a/docs/sql/mysql-and-mariadb-setup/index.html +++ b/docs/sql/mysql-and-mariadb-setup/index.html @@ -2,5 +2,5 @@ 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 c50f845..3bbfc93 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-1c8deb"},children:[{type:b,value:"\"help\""}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-f6ea5a"},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-eb3f14"},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-7f2cca"},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-7f2cca{color:#FF7B72}.ct-eb3f14{color:#8B949E}.ct-f6ea5a{color:#FF7B72}.ct-1c8deb{color:#A5D6FF}.ct-eb2006{color:#C9D1D9}.light .ct-eb2006{color:#657B83}.light .ct-1c8deb{color:#2AA198}.light .ct-f6ea5a{color:#859900}.light .ct-eb3f14{color:#93A1A1}.light .ct-7f2cca{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:1711020014439}}("element","text","span","code","code-inline","","p","line","pre","ct-eb2006","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-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 diff --git a/docs/sql/postgress-setup/index.html b/docs/sql/postgress-setup/index.html index afb20cc..7a8d101 100644 --- a/docs/sql/postgress-setup/index.html +++ b/docs/sql/postgress-setup/index.html @@ -2,11 +2,11 @@ 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 ef63ecb..94d1bcf 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-025a28"},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-025a28{color:#79C0FF}.ct-ca28c2{color:#A5D6FF}.ct-87910e{color:#8B949E}.ct-58bfb8{color:#79C0FF}.ct-9b1985{color:#FF7B72}.ct-ad8636{color:#D2A8FF}.ct-d2a04d{color:#FFA657}.ct-350da4{color:#C9D1D9}.ct-678de0{color:#C9D1D9}.ct-14c263{color:#FF7B72}.light .ct-14c263{color:#073642}.light .ct-678de0{color:#657B83}.light .ct-350da4{color:#268BD2}.light .ct-d2a04d{color:#268BD2}.light .ct-ad8636{color:#268BD2}.light .ct-9b1985{color:#859900}.light .ct-58bfb8{color:#859900}.light .ct-87910e{color:#93A1A1}.light .ct-ca28c2{color:#2AA198}.light .ct-025a28{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:1711020014473}}("element","text","span","ct-678de0","line","code-inline","code"," ","p","ct-9b1985","typescript","","ct-14c263","a","pre","Sample"," {",";","window","nofollow",":","ct-350da4","ct-ad8636","ct-87910e","ct-ca28c2",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-d2a04d","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-58bfb8","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-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 diff --git a/docs/typescript/add-global-variable-to-window/index.html b/docs/typescript/add-global-variable-to-window/index.html index ca2e5e5..7863e7b 100644 --- a/docs/typescript/add-global-variable-to-window/index.html +++ b/docs/typescript/add-global-variable-to-window/index.html @@ -2,5 +2,5 @@ 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 7a193fd..5aaa2c0 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-33e71b"},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-beca33"},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-bab85e{color:#A5D6FF}.ct-0ab8ab{color:#79C0FF}.ct-9ff890{color:#79C0FF}.ct-5e35ff{color:#8B949E}.ct-beca33{color:#D2A8FF}.ct-7ccbb6{color:#FFA657}.ct-6035c6{color:#FFA657}.ct-649304{color:#FF7B72}.ct-33e71b{color:#D2A8FF}.ct-7b2d18{color:#C9D1D9}.ct-bc0e15{color:#FF7B72}.ct-9ebe25{color:#FFA657}.ct-c6e64e{color:#FF7B72}.ct-b0dea2{color:#A5D6FF}.ct-0935dd{color:#C9D1D9}.ct-aa92c5{color:#C9D1D9}.ct-097431{color:#FF7B72}.light .ct-097431{color:#859900}.light .ct-aa92c5{color:#657B83}.light .ct-0935dd{color:#268BD2}.light .ct-b0dea2{color:#2AA198}.light .ct-c6e64e{color:#073642}.light .ct-9ebe25{color:#268BD2}.light .ct-bc0e15{color:#073642}.light .ct-7b2d18{color:#657B83}.light .ct-33e71b{color:#268BD2}.light .ct-649304{color:#859900}.light .ct-6035c6{color:#657B83}.light .ct-7ccbb6{color:#268BD2}.light .ct-beca33{color:#268BD2}.light .ct-5e35ff{color:#93A1A1}.light .ct-9ff890{color:#859900}.light .ct-0ab8ab{color:#D33682}.light .ct-bab85e{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:1711020014514}}("element","span","text","ct-aa92c5"," ","ct-097431","ct-9ebe25","line",", ","ct-c6e64e","ct-9ff890","ct-b0dea2","code","ct-0ab8ab"," ","=","\u003C","ct-7b2d18",":","extends","p","T","?","K","ct-bab85e","typescript","","ct-0935dd","type","never","pre","ct-5e35ff","|","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-649304"," ","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-bc0e15","t","ct-6035c6","key","ct-7ccbb6","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-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 diff --git a/docs/typescript/flatten-object-with-periods/index.html b/docs/typescript/flatten-object-with-periods/index.html index 74331b5..5b830ee 100644 --- a/docs/typescript/flatten-object-with-periods/index.html +++ b/docs/typescript/flatten-object-with-periods/index.html @@ -4,5 +4,5 @@ files by flattening it with period delimiter. Supports plural forms.">

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 bc4b71f..a11d372 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:1711020014820} \ 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:1711020228287} \ 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 24ee974..31e7767 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 @@ -2,5 +2,5 @@ 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 447aa6d..a1c8346 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-d84b94"},children:[{type:c,value:"function"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-d29147"},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-200008"},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-1d16bf"},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-6136c4"},children:[{type:c,value:"const"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-9e6c43"},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-e0a066{color:#D2A8FF}.ct-9e6c43{color:#79C0FF}.ct-6136c4{color:#FF7B72}.ct-1d16bf{color:#79C0FF}.ct-200008{color:#FFA657}.ct-ba46a6{color:#C9D1D9}.ct-a56ef8{color:#FF7B72}.ct-37d612{color:#C9D1D9}.ct-939d0a{color:#FFA657}.ct-e5c636{color:#FF7B72}.ct-7f7efa{color:#FFA657}.ct-d29147{color:#D2A8FF}.ct-8fe02f{color:#C9D1D9}.ct-d84b94{color:#FF7B72}.light .ct-d84b94{color:#073642}.light .ct-8fe02f{color:#657B83}.light .ct-d29147{color:#268BD2}.light .ct-7f7efa{color:#657B83}.light .ct-e5c636{color:#859900}.light .ct-939d0a{color:#268BD2}.light .ct-37d612{color:#657B83}.light .ct-a56ef8{color:#859900}.light .ct-ba46a6{color:#268BD2}.light .ct-200008{color:#268BD2}.light .ct-1d16bf{color:#B58900}.light .ct-6136c4{color:#073642}.light .ct-9e6c43{color:#268BD2}.light .ct-e0a066{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:1711020014560}}("element","span","text","ct-37d612"," ","line","ct-8fe02f","code","pet","ct-a56ef8","typescript","","ct-ba46a6","p","pre","ct-e5c636","ct-e0a066",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-939d0a","Fish"," ","();","Type Guards","\u002Ftypescript\u002Ftype-guards","root","Usage:","isFish","(","ct-7f7efa",":"," {"," (","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-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 diff --git a/docs/typescript/type-guards/index.html b/docs/typescript/type-guards/index.html index a5591d7..b0f5a71 100644 --- a/docs/typescript/type-guards/index.html +++ b/docs/typescript/type-guards/index.html @@ -2,5 +2,5 @@ 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