bellbind/index.html

## index.html
<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <script src="https://solid.github.io/solid-auth-client/dist/solid-auth-client.bundle.js"></script>
    <script type="module" src="./main.js"></script>
    <style>
#login {display: none;}
#webid:empty ~ #login {display: inline;}
#webid:empty ~ #logout {display: none;}
#webid:empty ~ #inbox {display: none;}
    </style>
  </head>
  <body>
    <div>
      <span id="webid"></span><button id="logout">logout</button>
      <button id="login">login</button>
      <button id="inbox">get inbox data</button>
      <pre id="output"></pre>
    </div>
  </body>
</html>

## main.js
// helpers
const onClick = (selector, asyncf) => {
  const elem = document.querySelector(selector);
  elem.addEventListener("click", ev => asyncf().catch(console.error));
};
const textContent = (selector, text) => {
  const elem = document.querySelector(selector);
  elem.textContent = text;
};

// currentSession/login/logout
async function main() {
  const session = await solid.auth.currentSession();
  if (session) textContent("#webid", session.webId);
}
main().catch(console.error);

onClick("#login", async () => {
  const popupUri = `https://solid.community/common/popup.html`;
  const session = await solid.auth.popupLogin({popupUri});
  if (session) textContent("#webid", session.webId);
});

onClick("#logout", async () => {
  await solid.auth.logout(); //=> undefined
  textContent("#webid", "");
  textContent("#output", "");
});

onClick("#inbox", async () => {
  const session = await solid.auth.currentSession();
  if (!session) {
    alert(`error: empty session`);
    return;
  }
  // {webId, idp, issuer, sessionKey, idClaims, authorization, credentialType}
  console.log(session);

  const url = new URL(session.webId);
  url.hash = "";
  url.pathname = "/inbox/"; // private resource on solid.community

  // solid.auth.fetch() returns Promise of standard Response
  const res = await solid.auth.fetch(url.href);
  //const res = await fetch(url.href); //=> 401 unauthorized
  console.log(res);
  textContent("#output", await res.text());
});
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8" />
	<script src="https://solid.github.io/solid-auth-client/dist/solid-auth-client.bundle.js"></script>
	<script type="module" src="./main.js"></script>
	<style>
	#login {display: none;}
	#webid:empty ~ #login {display: inline;}
	#webid:empty ~ #logout {display: none;}
	#webid:empty ~ #inbox {display: none;}
	</style>
	</head>
	<body>
	<div>
	<span id="webid"></span><button id="logout">logout</button>
	<button id="login">login</button>
	<button id="inbox">get inbox data</button>
	<pre id="output"></pre>
	</div>
	</body>
	</html>
	// helpers
	const onClick = (selector, asyncf) => {
	const elem = document.querySelector(selector);
	elem.addEventListener("click", ev => asyncf().catch(console.error));
	};
	const textContent = (selector, text) => {
	const elem = document.querySelector(selector);
	elem.textContent = text;
	};

	// currentSession/login/logout
	async function main() {
	const session = await solid.auth.currentSession();
	if (session) textContent("#webid", session.webId);
	}
	main().catch(console.error);

	onClick("#login", async () => {
	const popupUri = `https://solid.community/common/popup.html`;
	const session = await solid.auth.popupLogin({popupUri});
	if (session) textContent("#webid", session.webId);
	});

	onClick("#logout", async () => {
	await solid.auth.logout(); //=> undefined
	textContent("#webid", "");
	textContent("#output", "");
	});

	onClick("#inbox", async () => {
	const session = await solid.auth.currentSession();
	if (!session) {
	alert(`error: empty session`);
	return;
	}
	// {webId, idp, issuer, sessionKey, idClaims, authorization, credentialType}
	console.log(session);

	const url = new URL(session.webId);
	url.hash = "";
	url.pathname = "/inbox/"; // private resource on solid.community

	// solid.auth.fetch() returns Promise of standard Response
	const res = await solid.auth.fetch(url.href);
	//const res = await fetch(url.href); //=> 401 unauthorized
	console.log(res);
	textContent("#output", await res.text());
	});