Add more docs for using images

[rakyi]

No description provided.

[owidbot]

Quick links (staging server):

Site Dev	Site Preview	Admin	Wizard	Docs

Login: ssh owid@staging-site-images-docs

• Site-screenshots: https://github.com/owid/site-screenshots/compare/images-docs
• SVG tester: https://github.com/owid/owid-grapher-svgs/compare/images-docs

SVG tester:

Number of differences (default views): 0 ✅
Number of differences (all views): 0 ✅

Edited: 2024-12-11 11:31:18 UTC
Execution time: 1.21 seconds

[ikesau]

I'm not sure the alert's necessary, but we can add it if you want to be extremely clear 🙂

[ikesau]

The delete button also says this when you click it - do you think we need this extra spooky message too?

[rakyi]

Removing the alert.

But I'm now actually wondering if we should make the admin read-only in other envs than prod. You can't really upload the images in staging/locally and then use them in other envs, because the images table is only synced in the direction prod → {staging, local}, right? Same for deleting.

[ikesau]

Yeah, that's definitely an option.

If we had a way of knowing when we're in prod vs. staging, we could hide/disable the buttons/inputs on staging too, and explain that all updates to images must be done on prod.

I didn't do that because while developing the feature, I definitely needed to be able to CRUD images, and the intention had been for this to be a half-cycle amount of work.

But I'm going to make some tickets with potential follow ups that we can at least consider for cooldowns.

[rakyi]

We distinguish between envs already:

owid-grapher/adminSiteClient/AdminLayout.tsx

Lines 53 to 66 in a7d6726

	@computed get environmentSpan(): React.ReactElement {
	const { admin } = this.context
	if (admin.settings.ENV === "development") {
	return <span className="dev">dev</span>
	} else if (
	["https://owid.cloud", "https://admin.owid.io"].includes(
	window.location.origin
	)
	) {
	return <span className="live">live</span>
	} else {
	return <span className="test">test</span>
	}
	}