osGallery
2024-08-29
ethOS is the world's first Ethereum operating system. It's an open source project so anyone can contribute and build dApps for their dApp store. I bought a Pixel 7a last year and installed ethOS on it using their web installer.
Recently I've been on a bit of a career hiatus, so I took an evening out to build an Expo Android app that would use the ethOS SDK to display a gallery of the NFTs in the ethOS system wallet.
The app is really simple, just one screen that leverages the React Native flat list component to display the NFTs. I retrieve the address using the ethOS SDK, and then use Alchemy to retrieve the NFTs in the wallet. Then for each NFT, you can click into it and a bottom sheet opens up with some more details. I used the React Native Bottom Sheet package for that. Here's the function for retrieving the NFTs from Alchemy:
const address = ExpoWalletsdk.getAddress();
// with pagination, this gets rate limited if not on paid tier and more than a few 100 NFTs
const fetchNfts = async (
chainId = null,
pageKey = null,
accumulatedNfts = []
) => {
const chainParam = chainId || chain;
const baseUrl = CHAIN_URLS[chainParam];
let url = '${baseUrl}/${ALCHEMY_API_KEY}/getNFTsForOwner?owner=${address}&withMetadata=true&pageSize=100`;
if (pageKey) {
url += `&pageKey=${pageKey}`;
}
try {
const response = await fetch(url, {
method: "GET",
headers: {
accept: "application/json",
},
});
const data = await response.json();
const allNfts = [...accumulatedNfts, ...(data.ownedNfts || [])];
if (data.pageKey) {
return fetchNfts(chainId, data.pageKey, allNfts);
} else {
setNfts(allNfts);
}
} catch (err) {
console.error(err);
setNfts([]);
}
};
Check out the code for the app at my Github in this repo. Also you can watch a screen recording of how it looks on my ethOS device for my wallet here.