Remove support for FontAwesome 4.7 icon names (#9871)

This commit is contained in:
Penar Musaraj 2020-05-26 14:53:32 -04:00 committed by GitHub
parent 7820686f73
commit b1c726be0d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 36 additions and 527 deletions

View File

@ -1,8 +1,6 @@
import I18n from "I18n";
import { h } from "virtual-dom";
import attributeHook from "discourse-common/lib/attribute-hook";
import deprecated from "discourse-common/lib/deprecated";
import jQuery from "jquery";
const SVG_NAMESPACE = "http://www.w3.org/2000/svg";
let _renderers = [];
@ -43,474 +41,6 @@ const REPLACEMENTS = {
"notification.membership_request_consolidated": "users"
};
// TODO: use lib/svg_sprite/fa4-renames.json here
// Note: these should not be edited manually. They define the fa4-fa5 migration
const fa4Replacements = {
"500px": "fab-500px",
"address-book-o": "far-address-book",
"address-card-o": "far-address-card",
adn: "fab-adn",
amazon: "fab-amazon",
android: "fab-android",
angellist: "fab-angellist",
apple: "fab-apple",
"area-chart": "chart-area",
"arrow-circle-o-down": "far-arrow-alt-circle-down",
"arrow-circle-o-left": "far-arrow-alt-circle-left",
"arrow-circle-o-right": "far-arrow-alt-circle-right",
"arrow-circle-o-up": "far-arrow-alt-circle-up",
arrows: "arrows-alt",
"arrows-alt": "expand-arrows-alt",
"arrows-h": "arrows-alt-h",
"arrows-v": "arrows-alt-v",
"asl-interpreting": "american-sign-language-interpreting",
automobile: "car",
bandcamp: "fab-bandcamp",
bank: "university",
"bar-chart": "far-chart-bar",
"bar-chart-o": "far-chart-bar",
bathtub: "bath",
battery: "battery-full",
"battery-0": "battery-empty",
"battery-1": "battery-quarter",
"battery-2": "battery-half",
"battery-3": "battery-three-quarters",
"battery-4": "battery-full",
behance: "fab-behance",
"behance-square": "fab-behance-square",
"bell-o": "far-bell",
"bell-slash-o": "far-bell-slash",
bitbucket: "fab-bitbucket",
"bitbucket-square": "fab-bitbucket",
bitcoin: "fab-btc",
"black-tie": "fab-black-tie",
bluetooth: "fab-bluetooth",
"bluetooth-b": "fab-bluetooth-b",
"bookmark-o": "far-bookmark",
btc: "fab-btc",
"building-o": "far-building",
buysellads: "fab-buysellads",
cab: "taxi",
calendar: "calendar-alt",
"calendar-check-o": "far-calendar-check",
"calendar-minus-o": "far-calendar-minus",
"calendar-o": "far-calendar",
"calendar-plus-o": "far-calendar-plus",
"calendar-times-o": "far-calendar-times",
"caret-square-o-down": "far-caret-square-down",
"caret-square-o-left": "far-caret-square-left",
"caret-square-o-right": "far-caret-square-right",
"caret-square-o-up": "far-caret-square-up",
cc: "far-closed-captioning",
"cc-amex": "fab-cc-amex",
"cc-diners-club": "fab-cc-diners-club",
"cc-discover": "fab-cc-discover",
"cc-jcb": "fab-cc-jcb",
"cc-mastercard": "fab-cc-mastercard",
"cc-paypal": "fab-cc-paypal",
"cc-stripe": "fab-cc-stripe",
"cc-visa": "fab-cc-visa",
chain: "link",
"chain-broken": "unlink",
"check-circle-o": "far-check-circle",
"check-square-o": "far-check-square",
chrome: "fab-chrome",
"circle-o": "far-circle",
"circle-o-notch": "circle-notch",
"circle-thin": "far-circle",
clipboard: "far-clipboard",
"clock-o": "far-clock",
clone: "far-clone",
close: "times",
"cloud-download": "cloud-download-alt",
"cloud-upload": "cloud-upload-alt",
cny: "yen-sign",
"code-fork": "code-branch",
codepen: "fab-codepen",
codiepie: "fab-codiepie",
"comment-o": "far-comment",
commenting: "far-comment-dots",
"commenting-o": "far-comment-dots",
"comments-o": "far-comments",
compass: "far-compass",
connectdevelop: "fab-connectdevelop",
contao: "fab-contao",
copyright: "far-copyright",
"creative-commons": "fab-creative-commons",
"credit-card": "far-credit-card",
"credit-card-alt": "credit-card",
css3: "fab-css3",
cutlery: "utensils",
dashboard: "tachometer-alt",
dashcube: "fab-dashcube",
deafness: "deaf",
dedent: "outdent",
delicious: "fab-delicious",
deviantart: "fab-deviantart",
diamond: "far-gem",
digg: "fab-digg",
discord: "fab-discord",
dollar: "dollar-sign",
"dot-circle-o": "far-dot-circle",
dribbble: "fab-dribbble",
"drivers-license": "id-card",
"drivers-license-o": "far-id-card",
dropbox: "fab-dropbox",
drupal: "fab-drupal",
edge: "fab-edge",
eercast: "fab-sellcast",
empire: "fab-empire",
"envelope-o": "far-envelope",
"envelope-open-o": "far-envelope-open",
envira: "fab-envira",
etsy: "fab-etsy",
eur: "euro-sign",
euro: "euro-sign",
exchange: "exchange-alt",
expeditedssl: "fab-expeditedssl",
"external-link": "external-link-alt",
"external-link-square": "external-link-square-alt",
eye: "far-eye",
"eye-slash": "far-eye-slash",
eyedropper: "eye-dropper",
fa: "fab-font-awesome",
facebook: "fab-facebook-f",
"facebook-f": "fab-facebook-f",
"facebook-official": "fab-facebook",
"facebook-square": "fab-facebook-square",
feed: "rss",
"file-archive-o": "far-file-archive",
"file-audio-o": "far-file-audio",
"file-code-o": "far-file-code",
"file-excel-o": "far-file-excel",
"file-image-o": "far-file-image",
"file-movie-o": "far-file-video",
"file-o": "far-file",
"file-pdf-o": "far-file-pdf",
"file-photo-o": "far-file-image",
"file-picture-o": "far-file-image",
"file-powerpoint-o": "far-file-powerpoint",
"file-sound-o": "far-file-audio",
"file-text": "file-alt",
"file-text-o": "far-file-alt",
"file-video-o": "far-file-video",
"file-word-o": "far-file-word",
"file-zip-o": "far-file-archive",
"files-o": "far-copy",
firefox: "fab-firefox",
"first-order": "fab-first-order",
"flag-o": "far-flag",
flash: "bolt",
flickr: "fab-flickr",
"floppy-o": "far-save",
"folder-o": "far-folder",
"folder-open-o": "far-folder-open",
"font-awesome": "fab-font-awesome",
fonticons: "fab-fonticons",
"fort-awesome": "fab-fort-awesome",
forumbee: "fab-forumbee",
foursquare: "fab-foursquare",
"free-code-camp": "fab-free-code-camp",
"frown-o": "far-frown",
"futbol-o": "far-futbol",
gbp: "pound-sign",
ge: "fab-empire",
gear: "cog",
gears: "cogs",
"get-pocket": "fab-get-pocket",
gg: "fab-gg",
"gg-circle": "fab-gg-circle",
git: "fab-git",
"git-square": "fab-git-square",
github: "fab-github",
"github-alt": "fab-github-alt",
"github-square": "fab-github-square",
gitlab: "fab-gitlab",
gittip: "fab-gratipay",
glass: "glass-martini",
glide: "fab-glide",
"glide-g": "fab-glide-g",
google: "fab-google",
"google-plus": "fab-google-plus-g",
"google-plus-circle": "fab-google-plus",
"google-plus-official": "fab-google-plus",
"google-plus-square": "fab-google-plus-square",
"google-wallet": "fab-google-wallet",
gratipay: "fab-gratipay",
grav: "fab-grav",
group: "users",
"hacker-news": "fab-hacker-news",
"hand-grab-o": "far-hand-rock",
"hand-lizard-o": "far-hand-lizard",
"hand-o-down": "far-hand-point-down",
"hand-o-left": "far-hand-point-left",
"hand-o-right": "far-hand-point-right",
"hand-o-up": "far-hand-point-up",
"hand-paper-o": "far-hand-paper",
"hand-peace-o": "far-hand-peace",
"hand-pointer-o": "far-hand-pointer",
"hand-rock-o": "far-hand-rock",
"hand-scissors-o": "far-hand-scissors",
"hand-spock-o": "far-hand-spock",
"hand-stop-o": "far-hand-paper",
"handshake-o": "far-handshake",
"hard-of-hearing": "deaf",
"hdd-o": "far-hdd",
header: "heading",
"heart-o": "far-heart",
"hospital-o": "far-hospital",
hotel: "bed",
"hourglass-1": "hourglass-start",
"hourglass-2": "hourglass-half",
"hourglass-3": "hourglass-end",
"hourglass-o": "far-hourglass",
houzz: "fab-houzz",
html5: "fab-html5",
"id-card-o": "far-id-card",
ils: "shekel-sign",
image: "far-image",
imdb: "fab-imdb",
inr: "rupee-sign",
instagram: "fab-instagram",
institution: "university",
"internet-explorer": "fab-internet-explorer",
intersex: "transgender",
ioxhost: "fab-ioxhost",
joomla: "fab-joomla",
jpy: "yen-sign",
jsfiddle: "fab-jsfiddle",
"keyboard-o": "far-keyboard",
krw: "won-sign",
lastfm: "fab-lastfm",
"lastfm-square": "fab-lastfm-square",
leanpub: "fab-leanpub",
legal: "gavel",
"lemon-o": "far-lemon",
"level-down": "level-down-alt",
"level-up": "level-up-alt",
"life-bouy": "far-life-ring",
"life-buoy": "far-life-ring",
"life-ring": "far-life-ring",
"life-saver": "far-life-ring",
"lightbulb-o": "far-lightbulb",
"line-chart": "chart-line",
linkedin: "fab-linkedin-in",
"linkedin-square": "fab-linkedin",
linode: "fab-linode",
linux: "fab-linux",
"list-alt": "far-list-alt",
"long-arrow-down": "long-arrow-alt-down",
"long-arrow-left": "long-arrow-alt-left",
"long-arrow-right": "long-arrow-alt-right",
"long-arrow-up": "long-arrow-alt-up",
"mail-forward": "share",
"mail-reply": "reply",
"mail-reply-all": "reply-all",
"map-marker": "map-marker-alt",
"map-o": "far-map",
maxcdn: "fab-maxcdn",
meanpath: "fab-font-awesome",
medium: "fab-medium",
meetup: "fab-meetup",
"meh-o": "far-meh",
"minus-square-o": "far-minus-square",
mixcloud: "fab-mixcloud",
mobile: "mobile-alt",
"mobile-phone": "mobile-alt",
modx: "fab-modx",
money: "far-money-bill-alt",
"moon-o": "far-moon",
"mortar-board": "graduation-cap",
navicon: "bars",
"newspaper-o": "far-newspaper",
"object-group": "far-object-group",
"object-ungroup": "far-object-ungroup",
odnoklassniki: "fab-odnoklassniki",
"odnoklassniki-square": "fab-odnoklassniki-square",
opencart: "fab-opencart",
openid: "fab-openid",
opera: "fab-opera",
"optin-monster": "fab-optin-monster",
pagelines: "fab-pagelines",
"paper-plane-o": "far-paper-plane",
paste: "far-clipboard",
patreon: "fab-patreon",
"pause-circle-o": "far-pause-circle",
paypal: "fab-paypal",
pencil: "pencil-alt",
"pencil-square": "pen-square",
"pencil-square-o": "far-edit",
photo: "far-image",
"picture-o": "far-image",
"pie-chart": "chart-pie",
"pied-piper": "fab-pied-piper",
"pied-piper-alt": "fab-pied-piper-alt",
"pied-piper-pp": "fab-pied-piper-pp",
pinterest: "fab-pinterest",
"pinterest-p": "fab-pinterest-p",
"pinterest-square": "fab-pinterest-square",
"play-circle-o": "far-play-circle",
"plus-square-o": "far-plus-square",
"product-hunt": "fab-product-hunt",
qq: "fab-qq",
"question-circle-o": "far-question-circle",
quora: "fab-quora",
ra: "fab-rebel",
ravelry: "fab-ravelry",
rebel: "fab-rebel",
reddit: "fab-reddit",
"reddit-alien": "fab-reddit-alien",
"reddit-square": "fab-reddit-square",
refresh: "sync",
registered: "far-registered",
remove: "times",
renren: "fab-renren",
reorder: "bars",
repeat: "redo",
resistance: "fab-rebel",
rmb: "yen-sign",
"rotate-left": "undo",
"rotate-right": "redo",
rouble: "ruble-sign",
rub: "ruble-sign",
ruble: "ruble-sign",
rupee: "rupee-sign",
s15: "bath",
safari: "fab-safari",
scissors: "cut",
scribd: "fab-scribd",
sellsy: "fab-sellsy",
send: "paper-plane",
"send-o": "far-paper-plane",
"share-square-o": "far-share-square",
shekel: "shekel-sign",
sheqel: "shekel-sign",
shield: "shield-alt",
shirtsinbulk: "fab-shirtsinbulk",
"sign-in": "sign-in-alt",
"sign-out": "sign-out-alt",
signing: "sign-language",
simplybuilt: "fab-simplybuilt",
skyatlas: "fab-skyatlas",
skype: "fab-skype",
slack: "fab-slack",
sliders: "sliders-h",
slideshare: "fab-slideshare",
"smile-o": "far-smile",
snapchat: "fab-snapchat",
"snapchat-ghost": "fab-snapchat-ghost",
"snapchat-square": "fab-snapchat-square",
"snowflake-o": "far-snowflake",
"soccer-ball-o": "far-futbol",
"sort-alpha-asc": "sort-alpha-down",
"sort-alpha-desc": "sort-alpha-up",
"sort-amount-asc": "sort-amount-down",
"sort-amount-desc": "sort-amount-up",
"sort-asc": "sort-up",
"sort-desc": "sort-down",
"sort-numeric-asc": "sort-numeric-down",
"sort-numeric-desc": "sort-numeric-up",
soundcloud: "fab-soundcloud",
spoon: "utensil-spoon",
spotify: "fab-spotify",
"square-o": "far-square",
"stack-exchange": "fab-stack-exchange",
"stack-overflow": "fab-stack-overflow",
"star-half-empty": "far-star-half",
"star-half-full": "far-star-half",
"star-half-o": "far-star-half",
"star-o": "far-star",
steam: "fab-steam",
"steam-square": "fab-steam-square",
"sticky-note-o": "far-sticky-note",
"stop-circle-o": "far-stop-circle",
stumbleupon: "fab-stumbleupon",
"stumbleupon-circle": "fab-stumbleupon-circle",
"sun-o": "far-sun",
superpowers: "fab-superpowers",
support: "far-life-ring",
tablet: "tablet-alt",
tachometer: "tachometer-alt",
telegram: "fab-telegram",
television: "tv",
"tencent-weibo": "fab-tencent-weibo",
themeisle: "fab-themeisle",
thermometer: "thermometer-full",
"thermometer-0": "thermometer-empty",
"thermometer-1": "thermometer-quarter",
"thermometer-2": "thermometer-half",
"thermometer-3": "thermometer-three-quarters",
"thermometer-4": "thermometer-full",
"thumb-tack": "thumbtack",
"thumbs-o-down": "far-thumbs-down",
"thumbs-o-up": "far-thumbs-up",
ticket: "ticket-alt",
"times-circle-o": "far-times-circle",
"times-rectangle": "window-close",
"times-rectangle-o": "far-window-close",
"toggle-down": "far-caret-square-down",
"toggle-left": "far-caret-square-left",
"toggle-right": "far-caret-square-right",
"toggle-up": "far-caret-square-up",
trash: "trash-alt",
"trash-o": "far-trash-alt",
trello: "fab-trello",
tripadvisor: "fab-tripadvisor",
try: "lira-sign",
tumblr: "fab-tumblr",
"tumblr-square": "fab-tumblr-square",
"turkish-lira": "lira-sign",
twitch: "fab-twitch",
twitter: "fab-twitter",
"twitter-square": "fab-twitter-square",
unsorted: "sort",
usb: "fab-usb",
usd: "dollar-sign",
"user-circle-o": "far-user-circle",
"user-o": "far-user",
vcard: "address-card",
"vcard-o": "far-address-card",
viacoin: "fab-viacoin",
viadeo: "fab-viadeo",
"viadeo-square": "fab-viadeo-square",
"video-camera": "video",
vimeo: "fab-vimeo-v",
"vimeo-square": "fab-vimeo-square",
vine: "fab-vine",
vk: "fab-vk",
vkontakte: "fab-vk",
"volume-control-phone": "phone-volume",
warning: "exclamation-triangle",
wechat: "fab-weixin",
weibo: "fab-weibo",
weixin: "fab-weixin",
whatsapp: "fab-whatsapp",
"wheelchair-alt": "fab-accessible-icon",
"wikipedia-w": "fab-wikipedia-w",
"window-close-o": "far-window-close",
"window-maximize": "far-window-maximize",
"window-restore": "far-window-restore",
windows: "fab-windows",
won: "won-sign",
wordpress: "fab-wordpress",
wpbeginner: "fab-wpbeginner",
wpexplorer: "fab-wpexplorer",
wpforms: "fab-wpforms",
xing: "fab-xing",
"xing-square": "fab-xing-square",
"y-combinator": "fab-y-combinator",
"y-combinator-square": "fab-hacker-news",
yahoo: "fab-yahoo",
yc: "fab-y-combinator",
"yc-square": "fab-hacker-news",
yelp: "fab-yelp",
yen: "yen-sign",
yoast: "fab-yoast",
youtube: "fab-youtube",
"youtube-play": "fab-youtube",
"youtube-square": "fab-youtube-square"
};
export function replaceIcon(source, destination) {
REPLACEMENTS[source] = destination;
}
@ -584,36 +114,9 @@ function warnIfMissing(id) {
}
}
const reportedIcons = [];
function warnIfDeprecated(oldId, newId) {
deprecated(
`Please replace all occurrences of "${oldId}"" with "${newId}". FontAwesome 4.7 icon names are now deprecated and will be removed in the next release.`
);
if (!Discourse.testing && !reportedIcons.includes(oldId)) {
const errorData = {
message: `FA icon deprecation: replace "${oldId}"" with "${newId}".`,
stacktrace: Error().stack
};
jQuery.ajax(`${Discourse.BaseUri}/logs/report_js_error`, {
data: errorData,
type: "POST",
cache: false
});
reportedIcons.push(oldId);
}
}
function handleIconId(icon) {
let id = icon.replacementId || icon.id || "";
if (fa4Replacements.hasOwnProperty(id)) {
warnIfDeprecated(id, fa4Replacements[id]);
id = fa4Replacements[id];
}
// TODO: clean up "thumbtack unpinned" at source instead of here
id = id.replace(" unpinned", "");

View File

@ -0,0 +1,32 @@
# frozen_string_literal: true
class UpdateDeprecatedIconNames < ActiveRecord::Migration[6.0]
def up
migrate_value("up")
end
def down
migrate_value("down")
end
def migrate_value(dir)
icons = File.open("#{Rails.root}/db/migrate/20200517140915_fa4_renames.json", "r:UTF-8") { |f| JSON.parse(f.read) }
icons.each do |key, value|
from = dir == "up" ? key : value
to = dir == "up" ? value : key
execute <<~SQL
UPDATE badges
SET icon = '#{to}'
WHERE icon = '#{from}' OR icon = 'fa-#{from}'
SQL
execute <<~SQL
UPDATE groups
SET flair_icon = '#{to}'
WHERE flair_icon = '#{from}' OR flair_icon = 'fa-#{from}'
SQL
end
end
end

View File

@ -421,18 +421,10 @@ License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL
icons
end
def self.fa4_shim_file
"#{Rails.root}/lib/svg_sprite/fa4-renames.json"
end
def self.fa4_to_fa5_names
@db ||= File.open(fa4_shim_file, "r:UTF-8") { |f| JSON.parse(f.read) }
end
def self.process(icon_name)
icon_name = icon_name.strip
FA_ICON_MAP.each { |k, v| icon_name = icon_name.sub(k, v) }
fa4_to_fa5_names[icon_name] || icon_name
icon_name
end
def self.get_set_cache(key)

View File

@ -86,11 +86,6 @@ describe SvgSprite do
expect(SvgSprite.all_icons).not_to include(" fab-facebook-messenger ")
end
it 'includes Font Awesome 4.7 icons from badges' do
Fabricate(:badge, name: 'Custom Icon Badge', icon: 'fa-gamepad')
expect(SvgSprite.all_icons).to include("gamepad")
end
it 'includes Font Awesome 5 icons from badges' do
Fabricate(:badge, name: 'Custom Icon Badge', icon: 'far fa-building')
expect(SvgSprite.all_icons).to include("far-building")
@ -215,13 +210,8 @@ describe SvgSprite do
expect(SvgSprite.all_icons).to include("fab-bandcamp")
end
it "includes Font Awesome 4.7 icons as group flair" do
group = Fabricate(:group, flair_icon: "fa-air-freshener")
expect(SvgSprite.bundle).to match(/air-freshener/)
end
it "includes Font Awesome 5 icons as group flair" do
group = Fabricate(:group, flair_icon: "far fa-building")
expect(SvgSprite.bundle).to match(/building/)
it "includes Font Awesome icon from groups" do
group = Fabricate(:group, flair_icon: "far-building")
expect(SvgSprite.bundle).to match(/far-building/)
end
end

View File

@ -18,14 +18,6 @@ QUnit.test("return icon markup", assert => {
});
QUnit.test("convert icon names", assert => {
const fa47Icon = convertIconClass("fa-clock-o");
assert.ok(iconHTML(fa47Icon).indexOf("far-clock") > -1, "FA 4.7 syntax");
assert.ok(
iconHTML("area-chart").indexOf("chart-area") > -1,
"renamed FA 4.7 icons"
);
const fa5Icon = convertIconClass("fab fa-facebook");
assert.ok(iconHTML(fa5Icon).indexOf("fab-facebook") > -1, "FA 5 syntax");