binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[WEB-3892] chore: link item improvements (#6944)

Browse source 
* chore: code refactor

* chore: global link block component added

* chore: link item improvement and code refactor
This commit is contained in:
Anmol Singh Bhatia 2025-04-17 20:08:53 +05:30 • committed by GitHub
parent 18fb3b8450
commit be5d77d978
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
8 changed files with 210 additions and 212 deletions
Download patch file Download diff file Expand all files Collapse all files

167
packages/utils/src/get-icon-for-link.ts
View file

@ -1,109 +1,64 @@
import {
Github,
Linkedin,
Twitter,
Facebook,
Instagram,
Youtube,
Dribbble,
Figma,
FileText,
FileImage,
FileVideo,
FileAudio,
FileArchive,
FileSpreadsheet,
FileCode,
Mail,
Chrome,
Link2,
} from "lucide-react";
Github,
Linkedin,
Twitter,
Facebook,
Instagram,
Youtube,
Dribbble,
Figma,
FileText,
FileImage,
FileVideo,
FileAudio,
FileArchive,
FileSpreadsheet,
FileCode,
Mail,
Chrome,
Link2,
} from "lucide-react";
// get-icon-for-link.ts
type IconMatcher = {
pattern: RegExp;
icon: typeof Github;
};
export const getIconForLink = (url: string) => {
const lowerUrl = url.toLowerCase();
// Social Media
if (lowerUrl.indexOf("github.com") !== -1) return Github;
if (lowerUrl.indexOf("linkedin.com") !== -1) return Linkedin;
if (lowerUrl.indexOf("twitter.com") !== -1 || lowerUrl.indexOf("x.com") !== -1) return Twitter;
if (lowerUrl.indexOf("facebook.com") !== -1) return Facebook;
if (lowerUrl.indexOf("instagram.com") !== -1) return Instagram;
if (lowerUrl.indexOf("youtube.com") !== -1 || lowerUrl.indexOf("youtu.be") !== -1) return Youtube;
if (lowerUrl.indexOf("dribbble.com") !== -1) return Dribbble;
// Productivity / Tools
if (lowerUrl.indexOf("figma.com") !== -1) return Figma;
if (
lowerUrl.indexOf("google.com") !== -1 ||
lowerUrl.indexOf("docs.") !== -1 ||
lowerUrl.indexOf("doc.") !== -1
) return FileText;
// File types
if (
lowerUrl.indexOf(".jpg") !== -1 ||
lowerUrl.indexOf(".jpeg") !== -1 ||
lowerUrl.indexOf(".png") !== -1 ||
lowerUrl.indexOf(".gif") !== -1 ||
lowerUrl.indexOf(".bmp") !== -1 ||
lowerUrl.indexOf(".svg") !== -1 ||
lowerUrl.indexOf(".webp") !== -1
) return FileImage;
if (
lowerUrl.indexOf(".mp4") !== -1 ||
lowerUrl.indexOf(".mov") !== -1 ||
lowerUrl.indexOf(".avi") !== -1 ||
lowerUrl.indexOf(".wmv") !== -1 ||
lowerUrl.indexOf(".flv") !== -1 ||
lowerUrl.indexOf(".mkv") !== -1
) return FileVideo;
if (
lowerUrl.indexOf(".mp3") !== -1 ||
lowerUrl.indexOf(".wav") !== -1 ||
lowerUrl.indexOf(".ogg") !== -1
) return FileAudio;
if (
lowerUrl.indexOf(".zip") !== -1 ||
lowerUrl.indexOf(".rar") !== -1 ||
lowerUrl.indexOf(".7z") !== -1 ||
lowerUrl.indexOf(".tar") !== -1 ||
lowerUrl.indexOf(".gz") !== -1
) return FileArchive;
if (
lowerUrl.indexOf(".xls") !== -1 ||
lowerUrl.indexOf(".xlsx") !== -1 ||
lowerUrl.indexOf(".csv") !== -1
) return FileSpreadsheet;
if (
lowerUrl.indexOf(".pdf") !== -1 ||
lowerUrl.indexOf(".doc") !== -1 ||
lowerUrl.indexOf(".docx") !== -1 ||
lowerUrl.indexOf(".txt") !== -1
) return FileText;
if (
lowerUrl.indexOf(".html") !== -1 ||
lowerUrl.indexOf(".js") !== -1 ||
lowerUrl.indexOf(".ts") !== -1 ||
lowerUrl.indexOf(".jsx") !== -1 ||
lowerUrl.indexOf(".tsx") !== -1 ||
lowerUrl.indexOf(".css") !== -1 ||
lowerUrl.indexOf(".scss") !== -1
) return FileCode;
// Other
if (lowerUrl.indexOf("mailto:") !== -1) return Mail;
if (lowerUrl.indexOf("http") === 0) return Chrome;
return Link2;
};
const SOCIAL_MEDIA_MATCHERS: IconMatcher[] = [
{ pattern: /github\.com/, icon: Github },
{ pattern: /linkedin\.com/, icon: Linkedin },
{ pattern: /(twitter\.com|x\.com)/, icon: Twitter },
{ pattern: /facebook\.com/, icon: Facebook },
{ pattern: /instagram\.com/, icon: Instagram },
{ pattern: /youtube\.com/, icon: Youtube },
{ pattern: /dribbble\.com/, icon: Dribbble },
];
const PRODUCTIVITY_MATCHERS: IconMatcher[] = [
{ pattern: /figma\.com/, icon: Figma },
{ pattern: /(google\.com|docs\.|doc\.)/, icon: FileText },
];
const FILE_TYPE_MATCHERS: IconMatcher[] = [
{ pattern: /\.(jpg|jpeg|png|gif|bmp|svg|webp)$/, icon: FileImage },
{ pattern: /\.(mp4|mov|avi|wmv|flv|mkv)$/, icon: FileVideo },
{ pattern: /\.(mp3|wav|ogg)$/, icon: FileAudio },
{ pattern: /\.(zip|rar|7z|tar|gz)$/, icon: FileArchive },
{ pattern: /\.(xls|xlsx|csv)$/, icon: FileSpreadsheet },
{ pattern: /\.(pdf|doc|docx|txt)$/, icon: FileText },
{ pattern: /\.(html|js|ts|jsx|tsx|css|scss)$/, icon: FileCode },
];
const OTHER_MATCHERS: IconMatcher[] = [
{ pattern: /^mailto:/, icon: Mail },
{ pattern: /^http/, icon: Chrome },
];
export const getIconForLink = (url: string) => {
const lowerUrl = url.toLowerCase();
const allMatchers = [...SOCIAL_MEDIA_MATCHERS, ...PRODUCTIVITY_MATCHERS, ...FILE_TYPE_MATCHERS, ...OTHER_MATCHERS];
const matchedIcon = allMatchers.find(({ pattern }) => pattern.test(lowerUrl));
return matchedIcon?.icon ?? Link2;
};