Skip to content

reduce differences from misskey: icons references in source - closes #475

dakkar requested to merge map-icon-classes into develop

what does this do

this MR reduces the differences between our files and Misskey's, with the aim of making merges simpler

why?

We have replaced a ton of upstream class="ti…" literals with our own class="ph-…"

This creates annoying merge conflicts every time upstream touches one of those lines. Those conflicts are rarely real, the only part in conflict is that class="…" bit. This wastes time and brainpower every time we merge from upstream.

Conflicts should only occur when the meaning of the code has changed on both sides!

how does it do it?

I've replaced nearly all our ph classes with the value that's present on misskey/master, then added a build step to automatically put our classes back. This also simplifies dealing with code added by Misskey that includes icons: if they're icons we already mapped, we don't have to do anything!

how to test that we're closer to misksey

git remote update
git checkout map-icon-classes
git diff misskey/master

search for ti-; most occurrences should not be different, but:

  • if it's a block we added, we of course keep the ph-

    • but for our SkNote* components, I've copied the ti-* over so that sections identical to the corresponding MkNote* component are actually identical
  • sometimes our icons are more precise (ti-icons is used for too many things, ti-plus too, &c)

how to test that the output is pretty much the same

git checkout develop && git pull

edit packages/frontend/vite.config.ts:

chunkFileNames: process.env.NODE_ENV === 'production' ? '[hash:8].js' : '[name]-[hash:8].js',
assetFileNames: process.env.NODE_ENV === 'production' ? '[hash:8][extname]' : '[name]-[hash:8][extname]',

becomes:

chunkFileNames: '[name].js',
assetFileNames: '[name][extname]',
entryFileNames: '[name].js',

so we get the same names across rebuilds, and we can compare the contents

pnpm build && mv built built-base

git stash
git checkout map-icon-classes
git stash pop

pnpm build

git diff -b --word-diff=color \
  --word-diff-regex='[[:alnum:]_-]+|[^[:space:]]' \
	--no-index \
	-- built-base/ built/

then remove the hack:

git checkout -- packages/frontend/vite.config.ts

Differences

MkAnnouncementDialog / announcement:

  • ph-seal-warning -> ph-x-circle (error)
  • ph-check-circle -> ph-check (success)

MkDrive:

  • ph-folder -> ph-folder-plus (create folder)

MkSignin:

  • ph-keyhole -> ph-key (password)

MkSignupDialog:

  • ph-check -> ph-list-checks

various:

  • ph-arrows-clockwise -> ph-arrows-counter-clockwise (refresh, it was a mix previously)
  • ph-eye-closed -> ph-eye-slash (sensitive, it was a mix previously)
  • ph-share-network -> ph-link (for "copy url"; we still use ph-share-network for "share" menu entries)
  • ph-bell-ringing -> ph-bell ("note notification sound", it's more uniform this way)
  • ph-pin -> ph-push-pin (ph-pin doesn't exist)

api:

  • ph-webhooks-logo -> ph-key (we use ph-key elsewhere to refer to api)

a bunch of ph-foo ph-bold ph-lg-bar are now correctly ph-foo-bar ph-bold ph-lg (or, when ph-foo-bar doesn't exist, an actually correct icon)

avatar-decorations:

  • ph-floppy -> ph-floppy-disk (ph-floppy doesn't exist)

drive.file:

  • ph-file-text -> ph-file (it's a generic file, not a text one!)

get-user-menu:

  • ph-share -> ph-arrow-square-out (show on remote intance)

admin/overview:

  • ph-globe-hemisphere-west -> ph-cloud-arrow-down (sub, it was mangled before)
  • ph-globe-hemisphere-west -> ph-cloud-arrow-up (pub, it was mangled before)

Contribution Guidelines By submitting this merge request, you agree to follow our Contribution Guidelines

  • I agree to follow this project's Contribution Guidelines
  • I have made sure to test this pull request

Merge request reports