chore(*): lint

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "singleQuote": true,
+  "trailingComma": "all",
+  "printWidth": 100,
+  "tabWidth": 2,
+  "semi": true
+}

package.json

@@ -1,8 +1,8 @@
 {
-  "name": "chrome-extension-typescript-starter",
-  "version": "1.0.0",
-  "description": "chrome-extension-typescript-starter",
-  "main": "index.js",
+  "name": "send-whatsapp",
+  "version": "0.1.0",
+  "description": "Send a WhatsApp message to any selected number",
+  "private": true,
   "scripts": {
     "watch": "webpack --config webpack/webpack.dev.js --watch",
     "build": "webpack --config webpack/webpack.prod.js",
@@ -14,7 +14,7 @@
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "https://github.com/chibat/chrome-extension-typescript-starter.git"
+    "url": "https://github.com/bolshchikov/send-whatsapp-message.git"
   },
   "dependencies": {
     "country-calling-code": "^0.0.3",

src/background.ts

@@ -26,13 +26,15 @@ chrome.runtime.onMessage.addListener((message) => {
 });
 
 function sendWhatsApp(maybePhoneNumber?: string) {
-  getUserCountry().then(countryCode => {
-    const phoneNumber = extractPhoneNumber(countryCode, maybePhoneNumber);
-    if (phoneNumber) {
-      const url = `https://api.whatsapp.com/send/?phone=${phoneNumber}&text&type=phone_number&app_absent=0`;
-      chrome.tabs.create({ url: url });
-    }
-  }).catch(error => {
-    console.error(error.message);
-  });
+  getUserCountry()
+    .then((countryCode) => {
+      const phoneNumber = extractPhoneNumber(countryCode, maybePhoneNumber);
+      if (phoneNumber) {
+        const url = `https://api.whatsapp.com/send/?phone=${phoneNumber}&text&type=phone_number&app_absent=0`;
+        chrome.tabs.create({ url: url });
+      }
+    })
+    .catch((error) => {
+      console.error(error.message);
+    });
 }

src/options.tsx

@@ -1,23 +1,23 @@
-import React, { useEffect, useState } from "react";
-import { createRoot } from "react-dom/client";
+import React, { useEffect, useState } from 'react';
+import { createRoot } from 'react-dom/client';
 
 const Options = () => {
-  const [color, setColor] = useState<string>("");
-  const [status, setStatus] = useState<string>("");
+  const [color, setColor] = useState<string>('');
+  const [status, setStatus] = useState<string>('');
   const [like, setLike] = useState<boolean>(false);
 
   useEffect(() => {
     // Restores select box and checkbox state using the preferences
     // stored in chrome.storage.
     chrome.storage.sync.get(
       {
-        favoriteColor: "red",
+        favoriteColor: 'red',
         likesColor: true,
       },
       (items) => {
         setColor(items.favoriteColor);
         setLike(items.likesColor);
-      }
+      },
     );
   }, []);
 
@@ -30,22 +30,20 @@ const Options = () => {
       },
       () => {
         // Update status to let user know options were saved.
-        setStatus("Options saved.");
+        setStatus('Options saved.');
         const id = setTimeout(() => {
-          setStatus("");
+          setStatus('');
         }, 1000);
         return () => clearTimeout(id);
-      }
+      },
     );
   };
 
   return (
     <>
       <div>
-        Favorite color: <select
-          value={color}
-          onChange={(event) => setColor(event.target.value)}
-        >
+        Favorite color:{' '}
+        <select value={color} onChange={(event) => setColor(event.target.value)}>
           <option value="red">red</option>
           <option value="green">green</option>
           <option value="blue">blue</option>
@@ -68,10 +66,10 @@ const Options = () => {
   );
 };
 
-const root = createRoot(document.getElementById("root")!);
+const root = createRoot(document.getElementById('root')!);
 
 root.render(
   <React.StrictMode>
     <Options />
-  </React.StrictMode>
+  </React.StrictMode>,
 );

src/popup.tsx

@@ -8,7 +8,7 @@ const Popup = () => {
     const message = { action: 'sendWhatsApp', payload: phoneNumber };
 
     chrome.runtime.sendMessage(message);
-  }
+  };
   const changePhoneNumberHandler = (ev: React.ChangeEvent<HTMLInputElement>) => {
     setPhoneNumber(ev.target.value);
   };
@@ -25,7 +25,7 @@ const Popup = () => {
       <div style={{ display: 'flex', flexDirection: 'row', gap: '8px' }}>
         <input
           style={{ minWidth: '250px' }}
-          placeholder='E.g. +1 (343) 123 441 442'
+          placeholder="E.g. +1 (343) 123 441 442"
           value={phoneNumber}
           onChange={changePhoneNumberHandler}
         />
@@ -40,5 +40,5 @@ const root = createRoot(document.getElementById('root')!);
 root.render(
   <React.StrictMode>
     <Popup />
-  </React.StrictMode>
+  </React.StrictMode>,
 );

src/services/country.ts

@@ -1,6 +1,6 @@
 export const getUserCountry = (): Promise<string> => {
   return fetch('https://api.country.is/')
-    .then(response => response.json())
-    .then(data => data.country)
-    .catch(error => console.error('Failed to fetch country:', error));
+    .then((response) => response.json())
+    .then((data) => data.country)
+    .catch((error) => console.error('Failed to fetch country:', error));
 };

src/services/countryCodes.ts

@@ -1,5 +1,5 @@
 import { codes } from 'country-calling-code';
 
 export const getCountryDialCode = (countryIsoCode: string): string | undefined => {
-  return codes.find(({ isoCode2 }) => isoCode2 === countryIsoCode)?.countryCodes[0]
-} 
+  return codes.find(({ isoCode2 }) => isoCode2 === countryIsoCode)?.countryCodes[0];
+};

src/services/phoneNumber.spec.ts

@@ -39,4 +39,4 @@ describe('extractPhoneNumber', () => {
       extractPhoneNumber(countryCode, maybePhoneNumber);
     }).toThrow();
   });
-});
+});

src/services/phoneNumber.ts

@@ -2,7 +2,7 @@ import { getCountryDialCode } from './countryCodes';
 
 const parsePhoneNumber = (text?: string): string => {
   if (!text) {
-    throw new Error('No phone text provided')
+    throw new Error('No phone text provided');
   }
   const phoneNumber = text.replace(/\D/g, '');
   if (phoneNumber.length === 0) {
@@ -14,10 +14,10 @@ const parsePhoneNumber = (text?: string): string => {
 const formatPhoneNumber = (phoneNumber: string, countryCode?: string) => {
   const dialCode = countryCode ? getCountryDialCode(countryCode) : null;
   if (dialCode && !phoneNumber.startsWith(dialCode)) {
-    const normalizedPhoneNumber = phoneNumber.replace(/^0+/, '');  // Remove leading zeros
+    const normalizedPhoneNumber = phoneNumber.replace(/^0+/, ''); // Remove leading zeros
     return dialCode + normalizedPhoneNumber;
   } else {
-    return phoneNumber;  // Default to the number without modification if country code is not found
+    return phoneNumber; // Default to the number without modification if country code is not found
   }
 };