Refactor/naming

CHANGELOG.md

@@ -7,7 +7,9 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 ### Added
+- Add `ServiceName` enum
 ### Changed
+- Update naming conventions
 - GitHub action versions updated
 ## [0.5] - 2025-01-15
 ### Added

src/Data/constants.data.ts

@@ -0,0 +1,16 @@
+export enum ServiceName {
+	X = 'X',
+	Email = 'Email',
+	Gmail = 'Gmail',
+	Reddit = 'Reddit',
+	Trello = 'Trello',
+	Blogger = 'Blogger',
+	Yahoo = 'Yahoo Mail',
+	Telegram = 'Telegram',
+	Whatsapp = 'WhatsApp',
+	Facebook = 'Facebook',
+	Linkedin = 'LinkedIn',
+	Custom = 'Custom Share',
+	Pinterest = 'Pinterest',
+	HackerNews = 'Hacker News',
+}

src/Data/services.data.ts

@@ -11,100 +11,101 @@ import Facebook from '@assets/icons/services/facebook.svg';
 import Linkedin from '@assets/icons/services/linkedin.svg';
 import Pinterest from '@assets/icons/services/pinterest.svg';
 import HackerNews from '@assets/icons/services/hacker-news.svg';
+import { ServiceName } from './constants.data';
 
-export const services_url = (url: string, subject?: string): { [key: string]: string } => {
+export const getServiceURL = (url: string, subject?: string): { [key: string]: string } => {
 	return {
-		Email: `mailto:?subject=${subject}&body=${url}`,
-		Gmail: `https://mail.google.com/mail/u/0/?ui=2&fs=1&tf=cm&su=${subject}&body=${url}`,
-		Telegram: `https://telegram.me/share/url?url=${url}&text=${subject}`,
-		X: `https://x.com/intent/post?url=${url}&text=${subject}`,
-		WhatsApp: `https://api.whatsapp.com/send?text=${subject}%20${url}`,
-		'Yahoo Mail': `http://compose.mail.yahoo.com/?subject=${subject}&body=${url}`,
-		'Hacker News': `https://news.ycombinator.com/submitlink?u=${url}&t=${subject}`,
-		Facebook: `https://www.facebook.com/sharer/sharer.php?u=${url}&t=${subject}`,
-		LinkedIn: `https://www.linkedin.com/shareArticle?mini=true&url=${url}&text=${subject}`,
-		Reddit: `https://www.reddit.com/submit?url=${url}&title=${subject}`,
-		Pinterest: `https://www.pinterest.com/pin/create/button/?url=${url}&media=&description=${subject}`,
-		Blogger: `https://www.blogger.com/blog_this.pyra?u=${url}&n=${subject}&t&pli=1`,
-		Trello: `https://trello.com/add-card?name=${subject}&desc=${url}`,
+		[ServiceName.Email]: `mailto:?subject=${subject}&body=${url}`,
+		[ServiceName.Gmail]: `https://mail.google.com/mail/u/0/?ui=2&fs=1&tf=cm&su=${subject}&body=${url}`,
+		[ServiceName.Telegram]: `https://telegram.me/share/url?url=${url}&text=${subject}`,
+		[ServiceName.X]: `https://x.com/intent/post?url=${url}&text=${subject}`,
+		[ServiceName.Whatsapp]: `https://api.whatsapp.com/send?text=${subject}%20${url}`,
+		[ServiceName.Yahoo]: `http://compose.mail.yahoo.com/?subject=${subject}&body=${url}`,
+		[ServiceName.HackerNews]: `https://news.ycombinator.com/submitlink?u=${url}&t=${subject}`,
+		[ServiceName.Facebook]: `https://www.facebook.com/sharer/sharer.php?u=${url}&t=${subject}`,
+		[ServiceName.Linkedin]: `https://www.linkedin.com/shareArticle?mini=true&url=${url}&text=${subject}`,
+		[ServiceName.Reddit]: `https://www.reddit.com/submit?url=${url}&title=${subject}`,
+		[ServiceName.Pinterest]: `https://www.pinterest.com/pin/create/button/?url=${url}&media=&description=${subject}`,
+		[ServiceName.Blogger]: `https://www.blogger.com/blog_this.pyra?u=${url}&n=${subject}&t&pli=1`,
+		[ServiceName.Trello]: `https://trello.com/add-card?name=${subject}&desc=${url}`,
 	};
 };
 
-export const Services = [
+export const SERVICES = [
 	{
-		title: 'Email',
+		title: ServiceName.Email,
 		icon: Email,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/email.svg',
 		bg: '#888990',
 	},
 	{
-		title: 'Gmail',
+		title: ServiceName.Gmail,
 		icon: Gmail,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/gmail.svg',
 		bg: '#EA4335',
 	},
 	{
-		title: 'Telegram',
+		title: ServiceName.Telegram,
 		icon: Telegram,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/telegram.svg',
 		bg: '#2CA5E0',
 	},
 	{
-		title: 'X',
+		title: ServiceName.X,
 		icon: X,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/x.svg',
 		bg: '#1A1A1A',
 	},
 	{
-		title: 'WhatsApp',
+		title: ServiceName.Whatsapp,
 		icon: Whatsapp,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/whatsapp.svg',
 		bg: '#12AF0A',
 	},
 	{
-		title: 'Yahoo Mail',
+		title: ServiceName.Yahoo,
 		icon: Yahoo,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/yahoo.svg',
 		bg: '#400090',
 	},
 	{
-		title: 'Hacker News',
+		title: ServiceName.HackerNews,
 		icon: HackerNews,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/hacker-news.svg',
 		bg: '#ff6600',
 	},
 	{
-		title: 'Facebook',
+		title: ServiceName.Facebook,
 		icon: Facebook,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/facebook.svg',
 		bg: '#0866ff',
 	},
 	{
-		title: 'LinkedIn',
+		title: ServiceName.Linkedin,
 		icon: Linkedin,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/linkedin.svg',
 		bg: '#007bb5',
 	},
 	{
-		title: 'Reddit',
+		title: ServiceName.Reddit,
 		icon: Reddit,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/reddit.svg',
 		bg: '#ff4500',
 	},
 	{
-		title: 'Pinterest',
+		title: ServiceName.Pinterest,
 		icon: Pinterest,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/pinterest.svg',
 		bg: '#e60023',
 	},
 	{
-		title: 'Blogger',
+		title: ServiceName.Blogger,
 		icon: Blogger,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/blogger.svg',
 		bg: '#fda352',
 	},
 	{
-		title: 'Trello',
+		title: ServiceName.Trello,
 		icon: Trello,
 		iconUrl: 'https://github.com/openscilab/mybutton/raw/main/src/Assets/icons/services/trello.svg',
 		bg: '#0079bf',

src/Views/Layout/ShareModal/index.tsx

@@ -4,7 +4,7 @@ import useStore from '@src/Tools/Store/useStore';
 import { classes } from '@src/Tools/Utils/React';
 import { CONFIG } from '@src/App/Config/constants';
 import { encode } from '@src/Tools/Utils/URLEncoding';
-import { Services, services_url } from '@src/Data/services.data';
+import { SERVICES, getServiceURL } from '@src/Data/services.data';
 import EditableInput from '@src/Components/EditableInput/EditableInput';
 import { setOpenShareModal, useLocalCache } from '@src/Tools/Store/slices/LocalCacheSlice';
 import { Checkbox, CheckboxGroup, Col, Modal, Radio, RadioGroup, Row, Tooltip, Whisper } from 'rsuite';
@@ -122,11 +122,11 @@ const ShareModal = () => {
 				</div>
 				<div className='services-list'>
 					<Row>
-						{Services.map((service, i) => {
+						{SERVICES.map((service, i) => {
 							const validated_url = urlValidation(temp.url);
 							const href =
 								temp.shareMode === 'direct'
-									? services_url(validated_url, temp.subject)[service.title]
+									? getServiceURL(validated_url, temp.subject)[service.title]
 									: getShareLink(service.title, validated_url);
 							return (
 								<Col xs={12} sm={8} key={i}>

src/Views/Pages/GetButton/index.tsx

@@ -9,7 +9,7 @@ import { classes } from '../../../Tools/Utils/React';
 import { encode } from '@src/Tools/Utils/URLEncoding';
 import SyntaxHighlighter from 'react-syntax-highlighter';
 import { copyToClipboard } from '@src/Tools/Utils/React';
-import { Services, services_url } from '@src/Data/services.data';
+import { SERVICES, getServiceURL } from '@src/Data/services.data';
 import EditableInput from '@src/Components/EditableInput/EditableInput';
 import { lightfair } from 'react-syntax-highlighter/dist/esm/styles/hljs';
 import { ReactComponent as Clone } from '@assets/icons/clone-regular.svg';
@@ -63,8 +63,8 @@ const GetButton = () => {
 		}
 
 		const validated_url = urlValidation(temp.url || '');
-		const selected = Services.filter(service => selectedServices.includes(service.title));
-		const urls = services_url(validated_url, temp.subject);
+		const selected = SERVICES.filter(service => selectedServices.includes(service.title));
+		const urls = getServiceURL(validated_url, temp.subject);
 
 		const buttons = (
 			<div className='flex-center'>
@@ -237,7 +237,7 @@ const GetButton = () => {
 				<Modal.Body>
 					<div className='services-list'>
 						<Row>
-							{Services.map((service, i) => {
+							{SERVICES.map((service, i) => {
 								const checked = selectedServices.includes(service.title);
 								return (
 									<Col xs={12} sm={8} key={i}>

src/Views/Pages/Share/index.tsx

@@ -2,7 +2,7 @@ import './index.scss';
 import { useEffect } from 'react';
 import { useLocation } from 'react-router-dom';
 import LoadingCover from '@src/Components/LoadingCover';
-import { services_url } from '@src/Data/services.data';
+import { getServiceURL } from '@src/Data/services.data';
 import { decode } from '@src/Tools/Utils/URLEncoding';
 
 const Share = () => {
@@ -18,7 +18,7 @@ const Share = () => {
 		const subject = urlParams.get('subject') || '';
 		const link = urlParams.get('link') || '';
 
-		const url = services_url(encodeURIComponent(link), subject)[service];
+		const url = getServiceURL(encodeURIComponent(link), subject)[service];
 		setTimeout(() => {
 			window.open(url, '_self');
 		}, 100);