1"use strict";(self.webpackChunkwalletconnect_docs=self.webpackChunkwalletconnect_docs||[]).push([[1177],{8258:(n,t,e)=>{e.r(t),e.d(t,{assets:()=>a,contentTitle:()=>r,default:()=>d,frontMatter:()=>s,metadata:()=>o,toc:()=>u});var i=e(13274),c=e(79449);const s={},r=void 0,o={id:"appkit/shared/notifications/frontend-integration/api/managing-subscription/javascript",title:"javascript",description:"Subscribe, Unsubscribe, Get Subscription, Check if Subscribed.",source:"@site/docs/appkit/shared/notifications/frontend-integration/api/managing-subscription/javascript.mdx",sourceDirName:"appkit/shared/notifications/frontend-integration/api/managing-subscription",slug:"/appkit/shared/notifications/frontend-integration/api/managing-subscription/javascript",permalink:"/appkit/shared/notifications/frontend-integration/api/managing-subscription/javascript",draft:!1,unlisted:!1,editUrl:"https://github.com/WalletConnect/walletconnect-docs/blob/main/docs/appkit/shared/notifications/frontend-integration/api/managing-subscription/javascript.mdx",tags:[],version:"current",lastUpdatedAt:1740270108e3,frontMatter:{}},a={},u=[{value:"References",id:"references",level:4}];function p(n){const t={admonition:"admonition",code:"code",em:"em",h4:"h4",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,c.R)(),...n.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(t.p,{children:"Subscribe, Unsubscribe, Get Subscription, Check if Subscribed."}),"\n",(0,i.jsx)(t.admonition,{type:"note",children:(0,i.jsxs)(t.p,{children:["When using ",(0,i.jsx)(t.code,{children:"differentAccount"}),", the passed account needs to be previously registered.\nThis use case is for Dapps that have multiple active accounts or wallets with multiple active accounts.\n",(0,i.jsx)(t.code,{children:"differentAccount"})," can be used for all the below hooks and functions that accept ",(0,i.jsx)(t.code,{children:"account"})]})}),"\n",(0,i.jsx)(t.pre,{children:(0,i.jsx)(t.code,{className:"language-ts",children:"// check if current account is subscribed to current dapp\nconst isSubscribed = client.isSubscribedToDapp()\n\n// watch if current account is subscribed to current dapp\nclient.watchIsSubscribed(isSubbed => console.log({ isSubbed }))\n\n// subscribe to current dapp with current account\nawait client.subscribeToDapp()\n\n// subscribe to same dapp with different account\nawait client.subscribeToDapp(differentAccount)\n\n// subscribe to different dapp with current account\nawait client.subscribeToDapp(undefined, differentDomain)\n\n// subscribe to different dapp with different account\nawait client.subscribeToDapp(differentAccount, differentDomain)\n\n// unsubscribe from current dapp with current account\nawait client.unsubscribeFromDapp()\n\n// get current account's subscription to current dapp\nconst subscription = client.getSubscription()\n\n// watch current account's subscription to current dapp\nclient.watchSubscription(subscription => console.log({ subscription }))\n\n// get current account's subscriptions\nconst subscriptions = client.getSubscriptions()\n\n// watch current account's subscriptions\nclient.watchSubscriptions(subscriptions => console.log({ subscriptions }))\n"})}),"\n",(0,i.jsx)(t.h4,{id:"references",children:"References"}),"\n",(0,i.jsxs)(t.ul,{children:["\n",(0,i.jsxs)(t.li,{children:[(0,i.jsxs)(t.strong,{children:["account ",(0,i.jsx)(t.em,{children:"(Optional)"}),":"]})," CAIP-10 account"]}),"\n",(0,i.jsxs)(t.li,{children:[(0,i.jsxs)(t.strong,{children:["domain ",(0,i.jsx)(t.em,{children:"(Optional)"}),":"]})," dapp domain"]}),"\n",(0,i.jsxs)(t.li,{children:[(0,i.jsx)(t.strong,{children:"subscription:"})," ",(0,i.jsx)(t.em,{children:"Non-Reactive"})," state, returning current subscription information, of type:"]}),"\n"]}),"\n",(0,i.jsx)(t.pre,{children:(0,i.jsx)(t.code,{className:"language-ts",children:"{\n topic: string\n account: string\n relay: relayertypes.protocoloptions\n metadata: Metadata\n scope: ScopeMap\n expiry: number\n symkey: string\n unreadCount: number\n}\n"})}),"\n",(0,i.jsxs)(t.ul,{children:["\n",(0,i.jsxs)(t.li,{children:[(0,i.jsx)(t.strong,{children:"subscription:"})," ",(0,i.jsx)(t.em,{children:"Non-Reactive"})," state, returning array of current subscriptions"]}),"\n"]})]})}function d(n={}){const{wrapper:t}={...(0,c.R)(),...n.components};return t?(0,i.jsx)(t,{...n,children:(0,i.jsx)(p,{...n})}):p(n)}},79449:(n,t,e)=>{e.d(t,{R:()=>r,x:()=>o});var i=e(79474);const c={},s=i.createContext(c);function r(n){const t=i.useContext(s);return i.useMemo((function(){return"function"==typeof n?n(t):{...t,...n}}),[t,n])}function o(n){let t;return t=n.disableParentContext?"function"==typeof n.components?n.components(c):n.components||c:r(n.components),i.createElement(s.Provider,{value:t},n.children)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.