feat(links): do not copy shorten link by default (#8)

Author: bemble

README.md

@@ -142,6 +142,7 @@ Your web browser should open on `http://localhost:3000`. The app is configured t
 - [x] allow user to set the public url for shortened content
 - [x] move from sqlite3 to modernc.org/sqlite to compile without CGO (and use scratch, lighter image)
 - [x] display status with version
+- [ ] reduce duplicate code to display links
 - [ ] allow user to change language
 - [ ] add all options in front when create a new text
 - [ ] error handling (on add and delete)

front/src/pages/files/files_list_item/index.tsx

@@ -38,7 +38,7 @@ const TextsListItem:React.FC<TextsListItemProps> = ({file, onDelete, onShortened
             <Grid alignItems="center" container direction="row" flexWrap="nowrap">
                 <Grid className={classes.primary_info} container direction="column">
                     <Grid>
-                        <CopyToClipboard text={file.short_url} onCopy={onShortenedURLCopied}>
+                        <CopyToClipboard text={file.short_url} onCopy={onShortenedURLCopied} options={{format: "text/plain"}}>
                             <IconButton className={classes.copy_button} aria-label={t("files.copy_button_aria_label")} disabled={isDisabled}>
                                 <ContentCopyIcon />
                             </IconButton>

front/src/pages/files/index.tsx

@@ -23,8 +23,6 @@ const Links:React.FC = () => {
 
     const handleFileAdded = (f:ShortFile) => {
         setFiles({...files, [f.id]: f});
-        copy(f.short_url);
-        setDisplayCopySnack(true);
     };
 
     const handleFileDeleted = (id:string) => {

front/src/pages/links/add_link/index.tsx

@@ -2,20 +2,24 @@ import { Box, IconButton, InputBase, Paper } from "@mui/material";
 import { useTranslation } from "react-i18next";
 import classes from "./styles.module.scss";
 import {AddLink as AddLinkIcon} from "@mui/icons-material";
-import { ChangeEvent, FormEvent, useState } from "react";
+import { ChangeEvent, FormEvent, useCallback, useRef, useState } from "react";
 import { Link as ShortLink } from "../../../common/data.types";
 import { linksRepository } from "../../../repositories";
+import CopyToClipboard from "react-copy-to-clipboard";
 
 type AddLinkProps = {
     onAdd: (l: ShortLink) => void
 };
 
 const AddLink:React.FC<AddLinkProps> = ({onAdd}) => {
     const [url, setURL] = useState("");
+    const [shortURL, setShortURL] = useState<string>("");
     const [isValid, setIsValid] = useState(false);
     const [isLoading, setIsLoading] = useState(false);
     const {t} = useTranslation();
 
+    const shortRef = useRef<any>();
+
     const handleChangeUrl = (e:ChangeEvent<HTMLInputElement>) => {
         setURL(e.target.value);
         setIsValid(e.target.validity.valid);
@@ -26,7 +30,9 @@ const AddLink:React.FC<AddLinkProps> = ({onAdd}) => {
 
         setIsLoading(true);
 
-        const link = await linksRepository.add({link: url});
+        const link = await linksRepository.add({link: url.trim()});
+        setShortURL(link.short_url);
+
         onAdd(link);
 
         setURL("");

front/src/pages/links/index.tsx

@@ -23,8 +23,6 @@ const Links:React.FC = () => {
 
     const handleLinkAdded = (l:ShortLink) => {
         setLinks({...links, [l.id]: l});
-        copy(l.short_url);
-        setDisplayCopySnack(true);
     };
 
     const handleLinkDeleted = (id:string) => {

front/src/pages/links/links_list_item/index.tsx

@@ -38,7 +38,7 @@ const LinksListItem:React.FC<LinksListItemProps> = ({link, onDelete, onShortened
             <Grid alignItems="center" container direction="row" flexWrap="nowrap">
                 <Grid className={classes.primary_info} container direction="column">
                     <Grid>
-                        <CopyToClipboard text={link.short_url} onCopy={onShortenedURLCopied}>
+                        <CopyToClipboard text={link.short_url} onCopy={onShortenedURLCopied} options={{format: "text/plain"}}>
                             <IconButton className={classes.copy_button} aria-label={t("links.copy_button_aria_label")} disabled={isDisabled}>
                                 <ContentCopyIcon />
                             </IconButton>

front/src/pages/texts/index.tsx

@@ -23,8 +23,6 @@ const Links:React.FC = () => {
 
     const handleTextAdded = (t:ShortText) => {
         setTexts({...texts, [t.id]: t});
-        copy(t.short_url);
-        setDisplayCopySnack(true);
     };
 
     const handleTextDeleted = (id:string) => {

front/src/pages/texts/texts_list_item/index.tsx

@@ -38,7 +38,7 @@ const TextsListItem:React.FC<TextsListItemProps> = ({text, onDelete, onShortened
             <Grid alignItems="center" container direction="row" flexWrap="nowrap">
                 <Grid className={classes.primary_info} container direction="column">
                     <Grid>
-                        <CopyToClipboard text={text.short_url} onCopy={onShortenedURLCopied}>
+                        <CopyToClipboard text={text.short_url} onCopy={onShortenedURLCopied} options={{format: "text/plain"}}>
                             <IconButton className={classes.copy_button} aria-label={t("texts.copy_button_aria_label")} disabled={isDisabled}>
                                 <ContentCopyIcon />
                             </IconButton>