Shorten share modal urls

__tests__/url.test.ts

@@ -6,8 +6,12 @@ const URL_LONG_2  = 'https://www.example.com';
 const URL_LONG_3  = 'https://example.com/';
 const URL_LONG_4  = 'http://example.com/';
 const URL_LONG_5  = 'https://example.com';
+const URL_LONG_6  = 'https://example.com/final-path';
+const URL_LONG_7  = 'https://example.com/final-path/';
+
 const URL_SHORT_1 = 'example.com';
 const URL_SHORT_2 = 'example.com/';
+const URL_SHORT_3 = 'example.com/final-path';
 
 describe('String', () => {
   it('url can be shortened', () => {
@@ -16,6 +20,8 @@ describe('String', () => {
     expect(shortenUrl(URL_LONG_3)).toBe(URL_SHORT_1);
     expect(shortenUrl(URL_LONG_4)).toBe(URL_SHORT_1);
     expect(shortenUrl(URL_SHORT_1)).toBe(URL_SHORT_1);
+    expect(shortenUrl(URL_LONG_6)).toBe(URL_SHORT_3);
+    expect(shortenUrl(URL_LONG_7)).toBe(URL_SHORT_3);
   });
   it('url can be made absolute', () => {
     expect(makeUrlAbsolute(URL_SHORT_1)).toBe(URL_LONG_5);

src/components/ShareModal.tsx

@@ -7,6 +7,7 @@ import { BiCopy } from 'react-icons/bi';
 import { toast } from 'sonner';
 import { FiCheckSquare } from 'react-icons/fi';
 import { ReactNode } from 'react';
+import { shortenUrl } from '@/utility/url';
 
 export default function ShareModal({
   title = 'Share',
@@ -39,7 +40,7 @@ export default function ShareModal({
           'border border-gray-200 dark:border-gray-800',
         )}>
           <div className="truncate p-2 w-full">
-            {pathShare}
+            {shortenUrl(pathShare)}
           </div>
           <div
             className={cc(

src/utility/url.ts

@@ -1,6 +1,8 @@
 // Remove protocol, www, and trailing slash from url
 export const shortenUrl = (url?: string) => url
-  ? url.replace(/^(?:https?:\/\/)?(?:www\.)?/i, '').split('/')[0]
+  ? url
+    .replace(/^(?:https?:\/\/)?(?:www\.)?/i, '')
+    .replace(/\/$/, '')
   : undefined;
 
 // Add protocol to url and remove trailing slash