feat: show remaining CDN & cache-miss egress #538

bajtos · 2026-01-07T11:12:47Z

Update the demo app to show remaining egress allowances for each data set where the FilBeam service is enabled.

Screenshot showing the new version in practice:

version 2 using FolderSync icon

version 1 using RefreshCw icon

Signed-off-by: Miroslav Bajtoš <[email protected]>

cloudflare-workers-and-pages · 2026-01-07T11:14:09Z

Deploying with Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
⛔ Deployment terminated View logs	synapse-dev	`c0bbd0e`	Commit Preview URL Branch Preview URL	Jan 07 2026, 12:14 PM

juliangruber · 2026-01-07T11:24:31Z

apps/synapse-playground/src/components/warm-storage/data-sets-section.tsx

+                            </TooltipTrigger>
+                            <TooltipContent>
+                              <p>Cache miss egress quota remaining</p>
+                            </TooltipContent>


The icons aren't clear to me, at first I assumed the globe would stand for global traffic. Otoh, this is just a demo app, so we don't have to get the UX exaclty right.

Proposals:

Use icon ⬇️ for egress

Replace icons with text

I share your concerns.

How do you feel about the updated version using "folder sync" for the cache-miss egress quota?

I think I prefered the previous version, but don't have a strong opinion

Icons, "folder sync" one in particular, definitely seem a bit confusing.

Done in ac134f7.

🌐 Egress remaining: 98.42 GiB delivery · 43.31 GiB cache-miss

Would you like me to add tooltips for "delivery" and "cache-miss" to explain what these labels mean (traffic from the client to Filbeam, traffic from FilBeam to the SP).

I think it's fine like this

packages/synapse-react/src/warm-storage/use-data-sets.ts

Signed-off-by: Miroslav Bajtoš <[email protected]>

bajtos · 2026-01-07T11:44:44Z

packages/synapse-react/src/warm-storage/use-data-sets.ts

+function getFilBeamStatsBaseUrl(chainId: number): string {
+  return chainId === 314 ? 'https://stats.filbeam.com' : 'https://calibration.stats.filbeam.com'
+}


Should we move this helper to synapse-core, to avoid duplication between synapse-react and synapse-sdk?

synapse-sdk/packages/synapse-sdk/src/filbeam/service.ts

Lines 71 to 76 in 87ac7a8

/**

* Get the base stats URL for the current network

*/

private _getStatsBaseUrl(): string {

return this._network === 'mainnet' ? 'https://stats.filbeam.com' : 'https://calibration.stats.filbeam.com'

}

yes make a filbeam file or folder in core and move this there

rvagg · 2026-01-08T08:04:27Z

This seems fine to me and I appreciate the AGENTS.md edits but I'm going to leave it to @hugomrdias to review

apps/synapse-playground/src/lib/utils.ts

- Change format to "Egress remaining: X GiB delivery · Y GiB cache-miss" - Remove FolderSync icon, keep Globe icon with tooltip "This data set is using CDN" - Use binary units (KiB, MiB, GiB, TiB) instead of decimal units Co-Authored-By: Claude Code <[email protected]> Signed-off-by: Miroslav Bajtoš <[email protected]>

bajtos · 2026-01-13T10:13:12Z

I addressed the review comments, this PR is ready for another round of reviews. 🙏🏻

pyropy

LGTM 👍🏻

hugomrdias · 2026-01-13T13:17:41Z

apps/synapse-playground/src/lib/utils.ts

+export function formatBytes(bytes: bigint | number): string {
+  const num = typeof bytes === 'bigint' ? Number(bytes) : bytes
+  if (num === 0) return '0 B'
+
+  const units = ['B', 'KiB', 'MiB', 'GiB', 'TiB']
+  const k = 1024
+  const i = Math.floor(Math.log(num) / Math.log(k))
+  const value = num / k ** i
+
+  return `${value.toFixed(2).replace(/\.?0+$/, '')} ${units[i]}`
+}


use https://github.com/sindresorhus/pretty-bytes

hugomrdias · 2026-01-13T13:22:57Z

packages/synapse-react/src/warm-storage/use-data-sets.ts

+function getFilBeamStatsBaseUrl(chainId: number): string {
+  return chainId === 314 ? 'https://stats.filbeam.com' : 'https://calibration.stats.filbeam.com'
+}


yes make a filbeam file or folder in core and move this there

hugomrdias · 2026-01-13T13:23:59Z

packages/synapse-react/src/warm-storage/use-data-sets.ts

+async function fetchDataSetEgressQuota(chainId: number, dataSetId: bigint): Promise<DataSetEgressQuota | undefined> {
+  const baseUrl = getFilBeamStatsBaseUrl(chainId)
+  const url = `${baseUrl}/data-set/${dataSetId}`
+
+  try {
+    const response = await fetch(url)
+    if (!response.ok) {
+      console.error(`Failed to fetch data set egress quota: ${response.status} ${response.statusText}`)
+      return undefined
+    }
+
+    const data = (await response.json()) as Record<string, unknown>
+
+    if (typeof data.cdnEgressQuota !== 'string' || typeof data.cacheMissEgressQuota !== 'string') {
+      console.error('Unexpected response body from FilBeam Stats API:', data)
+      return undefined
+    }
+
+    return {
+      cdnEgressQuota: BigInt(data.cdnEgressQuota),
+      cacheMissEgressQuota: BigInt(data.cacheMissEgressQuota),
+    }
+  } catch (err) {
+    console.error('Cannot fetch data set egress quotas from FilBeam Stats API', err)
+    return undefined
+  }


same move to core pls use the request lib we use for sp client and make proper error

hugomrdias · 2026-01-13T13:26:11Z

packages/synapse-react/src/warm-storage/use-data-sets.ts

+              const egressQuota = dataSet.cdn ? await fetchDataSetEgressQuota(chainId, dataSet.dataSetId) : undefined
+


im not sold on put this inside useDataSets its already pretty heavy and we are rethinking the apis for costs and balances right now.

hugomrdias · 2026-01-13T13:28:52Z

apps/synapse-playground/src/components/warm-storage/data-sets-section.tsx

-                        </TooltipContent>
-                      </Tooltip>
+                      <span className="flex items-center gap-1 text-sm text-muted-foreground">
+                        <Tooltip>


i would make a custom tooltip component wrapping the globe icon with all the cdn info, using a hook to fetch the data.

check the other hooks that use tanstack query to wrap fetchDataSetEgressQuota

bajtos added 2 commits January 7, 2026 12:06

feat: show remaining CDN & cache-miss egress

fd491d0

Signed-off-by: Miroslav Bajtoš <[email protected]>

chore: document synapse-react in AGENTS.md

9aa16b7

Signed-off-by: Miroslav Bajtoš <[email protected]>

bajtos requested review from juliangruber and pyropy January 7, 2026 11:12

bajtos requested review from hugomrdias and rvagg as code owners January 7, 2026 11:12

github-project-automation bot added this to FS Jan 7, 2026

github-project-automation bot moved this to 📌 Triage in FS Jan 7, 2026

juliangruber approved these changes Jan 7, 2026

View reviewed changes

bajtos added 3 commits January 7, 2026 12:25

fixup! cache-miss icon RefreshCW -> FolderSync

2132a05

Signed-off-by: Miroslav Bajtoš <[email protected]>

fixup! npm run lint:fix

f029bc4

Signed-off-by: Miroslav Bajtoš <[email protected]>

fixup! code cleanup + better error logging

b1f0f04

Signed-off-by: Miroslav Bajtoš <[email protected]>

bajtos mentioned this pull request Jan 7, 2026

feat: access stats from browsers filbeam/worker#539

Merged

rjan90 moved this from 📌 Triage to 🔎 Awaiting review in FS Jan 7, 2026

rjan90 added this to the M4: Filecoin Service Liftoff milestone Jan 7, 2026

bajtos mentioned this pull request Jan 7, 2026

fix: change FilBeam URL to stats.filbeam.com #539

Merged

fixup! forgotten err

10c3811

Signed-off-by: Miroslav Bajtoš <[email protected]>

bajtos commented Jan 7, 2026

View reviewed changes

Merge branch 'master' into feat-egress-allowance

c0bbd0e

rjan90 moved this from 🔎 Awaiting review to ✔️ Approved by reviewer in FS Jan 7, 2026

rjan90 assigned bajtos Jan 7, 2026

rvagg removed their request for review January 8, 2026 08:04

BigLep moved this from ✔️ Approved by reviewer to 🔎 Awaiting review in FS Jan 8, 2026

pyropy reviewed Jan 12, 2026

View reviewed changes

apps/synapse-playground/src/lib/utils.ts Outdated Show resolved Hide resolved

bajtos requested review from juliangruber and pyropy January 13, 2026 10:12

pyropy approved these changes Jan 13, 2026

View reviewed changes

hugomrdias requested changes Jan 13, 2026

View reviewed changes

github-project-automation bot moved this from 🔎 Awaiting review to ⌨️ In Progress in FS Jan 13, 2026

	/**
	* Get the base stats URL for the current network
	*/
	private _getStatsBaseUrl(): string {
	return this._network === 'mainnet' ? 'https://stats.filbeam.com' : 'https://calibration.stats.filbeam.com'
	}

		const egressQuota = dataSet.cdn ? await fetchDataSetEgressQuota(chainId, dataSet.dataSetId) : undefined

feat: show remaining CDN & cache-miss egress #538

Are you sure you want to change the base?

feat: show remaining CDN & cache-miss egress #538

Uh oh!

Conversation

bajtos commented Jan 7, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

cloudflare-workers-and-pages bot commented Jan 7, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploying with Cloudflare Workers

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

rvagg commented Jan 8, 2026

Uh oh!

Uh oh!

bajtos commented Jan 13, 2026

Uh oh!

pyropy left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

bajtos commented Jan 7, 2026 •

edited

Loading

cloudflare-workers-and-pages bot commented Jan 7, 2026 •

edited

Loading