Merge pull request #163 from thanhdanh27600/staging

Staging

README.md

@@ -1,20 +1,25 @@
-# Clickdi - URL Shortener
+# Quickshare - URL Shortener
 
-Lightweight web application for shortening URLs, along with real-time click tracking, differentiate between real and unique clicks, free to use and modify.
+Lightweight web application for create notes and shortening URLs, along with real-time click tracking, differentiate between real and unique clicks, free to use.
 
 ## What's this
 
-- **Shortening URLs**: Shorten link to 3 unique hash xxx (clid.top/xxx), link saved by IP, no sign in required tracking shortened link goes publicly, unless set new password
+- **Creat Note & Shorten URLs**: Create note super easy with shortened link to 3 unique hash xxx (qsh.at/xxx), link then saved by IP, no sign in required.
 
-- **Detect Uniqe Clicks**: Tracks clicks on the shortened URLs in real-time (polling)
+- **Tracking URLs**: Resource management (note & shortened link) goes publicly, unless set new password. 
+
+- **Detect Unique Clicks**: Tracks clicks on the shortened URLs in polling time
 
 - **Detect Human Clicks**: Distinguish genuine clicks from bots or automated scripts
 
-- **Free to Use**: Free to clone, modify, and distribute.
+- **Free to Use**: Start to use [https://quickshare.at](https://quickshare.at)
+, always free
 
 ## How to Build
 
-*To be updated*
+- Copy `.env.example` and modify to your credential
+- Remove `.gpg` files
+- `yarn install` & `yarn dev`
 
 ## Contact
 

public/locales/en/common.json

@@ -55,7 +55,7 @@
   "brandDescription": "Share and Create Free Notes with URLs Shortener. Quickshare save your notes, texts, and track shortened links, click counts, locations, and all related data.",
   "advancedView": "Advanced info",
   "loadMore": "Load more",
-  "editPreview": "More options",
+  "editPreview": "Edit links",
   "save": "Save",
   "maximumCharaters": "Maximum of {{n}} characters",
   "uploadImage": "Upload image",

public/sitemap.xml

@@ -9,14 +9,14 @@
 
 <url>
   <loc>https://quickshare.at</loc>
-  <lastmod>2023-07-22</lastmod>
+  <lastmod>2023-09-10</lastmod>
   <changefreq>monthly</changefreq>
   <priority>0.8</priority>
 </url>
 
 <url>
   <loc>https://quickshare.at/en</loc>
-  <lastmod>2023-07-22</lastmod>
+  <lastmod>2023-09-10</lastmod>
   <changefreq>monthly</changefreq>
   <priority>0.8</priority>
 </url>

src/api/requests.ts

@@ -32,16 +32,24 @@ export const updateShortenUrlRequest = async ({
   mediaId?: number;
   locale: Locale;
 }) => {
-  const rs = await API.put(`/api/shorten/update`, {
-    locale,
-    hash,
-    ogTitle,
-    ogDescription,
-    ogImgSrc,
-    ogImgPublicId,
-    theme,
-    mediaId,
-  });
+  const rs = await API.put(
+    `/api/shorten/update`,
+    {
+      locale,
+      hash,
+      ogTitle,
+      ogDescription,
+      ogImgSrc,
+      ogImgPublicId,
+      theme,
+      mediaId,
+    },
+    {
+      headers: {
+        ...withAuth(),
+      },
+    },
+  );
   const data = rs.data;
   return data as ShortenUrl;
 };
@@ -68,7 +76,6 @@ export const getStats = async ({
   hash,
   email,
   password,
-  token,
   queryCursor,
 }: {
   hash: string;
@@ -85,7 +92,7 @@ export const getStats = async ({
   });
   const rs = await API.get(`/api/stats?${q}`, {
     headers: {
-      ...withAuth(token),
+      ...withAuth(),
     },
   });
   const data = rs.data;

src/components/atoms/Accordion.tsx

@@ -27,6 +27,7 @@ export const Accordion = ({ children, title, defaultOpen, className }: Props) =>
             className="[&:not([data-te-collapse-collapsed])]:text-primary group relative flex w-full items-center rounded-none border-0 py-4 text-left text-base transition [overflow-anchor:none] hover:z-[2] focus:z-[3] focus:outline-none"
             type="button"
             data-te-collapse-init
+            data-te-collapse-collapsed
             data-te-target={`#${collapseId}`}
             aria-controls={collapseId}>
             <span className="h-4 w-4 rotate-[-180deg] fill-[#336dec] transition-transform duration-200 ease-in-out group-[[data-te-collapse-collapsed]]:mr-0 group-[[data-te-collapse-collapsed]]:rotate-0 group-[[data-te-collapse-collapsed]]:fill-[#212529] motion-reduce:transition-none">

src/components/atoms/Button.tsx

@@ -10,10 +10,19 @@ export interface ButtonProps extends DetailedHTMLProps<ButtonHTMLAttributes<HTML
   variant?: ButtonVariants;
   loading?: boolean;
   animation?: boolean;
+  hoverTransform?: boolean;
 }
 
 export const Button = (props: ButtonProps) => {
-  const { text = 'Button', variant = 'filled', loading, animation, TextClassname, ...otherProps } = props;
+  const {
+    text = 'Button',
+    variant = 'filled',
+    loading,
+    animation,
+    hoverTransform = true,
+    TextClassname,
+    ...otherProps
+  } = props;
   return (
     <button
       {...otherProps}
@@ -22,7 +31,8 @@ export const Button = (props: ButtonProps) => {
         {
           'py-2.5 text-white focus:outline-none focus:ring-cyan-400': variant === 'filled',
           'hover:gradient-bg from-purple-600 to-cyan-600/80': animation,
-          'from-blue-600  to-cyan-500 hover:opacity-80 hover:shadow-btn-hover': !animation,
+          'from-blue-600  to-cyan-500': !animation,
+          'hover:-translate-y-1 hover:translate-x-1 hover:opacity-80 hover:shadow-btn-hover': hoverTransform,
           'relative inline-flex items-center justify-center overflow-hidden border border-cyan-300 bg-none p-1 text-gray-900  hover:text-cyan-500 focus:outline-none focus:ring-cyan-400':
             variant === 'outlined',
         },

src/components/gadgets/AdvancedSettingUrlForm.tsx

@@ -72,13 +72,12 @@ export const AdvancedSettingUrlForm = () => {
   }, [ogTitle, ogDescription]);
 
   useEffect(() => {
-    if (shortenHistory)
-      debouncedUpdate({
-        ogTitle: shortenHistory.ogTitle || t('ogTitle', { hash: shortenHistory.hash ?? 'XXX' }),
-        ogDescription: shortenHistory.ogDescription || t('ogDescription'),
-        ogImgSrc: shortenHistory.ogImgSrc,
-      });
-  }, [shortenHistory]);
+    debouncedUpdate({
+      ogTitle: shortenHistory?.ogTitle || t('ogTitle', { hash: shortenHistory?.hash ?? 'XXX' }),
+      ogDescription: shortenHistory?.ogDescription || t('ogDescription'),
+      ogImgSrc: shortenHistory?.ogImgSrc,
+    });
+  }, []);
 
   const updateShortenUrl = useMutation(QueryKey.SHORTEN_UPDATE, {
     mutationFn: updateShortenUrlRequest,

src/components/layouts/LayoutMain.tsx

@@ -4,15 +4,17 @@ import { BrandHead } from './BrandHead';
 import { Footer } from './Footer';
 import { Header } from './Header';
 
-export const LayoutMain = ({ children }: React.PropsWithChildren) => {
+export const LayoutMain = ({ children, featureTab = true }: React.PropsWithChildren & { featureTab?: boolean }) => {
   return (
     <div className="bg-gray-50/50">
       <BrandHead />
       <Header />
       <div className={clsx('container-xl mx-auto mb-0 min-h-[80vh] p-4 max-sm:py-8 sm:mb-16 md:max-w-7xl')}>
-        <div className={'mb-8'}>
-          <FeatureTabs />
-        </div>
+        {featureTab && (
+          <div className={'mb-8'}>
+            <FeatureTabs />
+          </div>
+        )}
         {children}
       </div>
       <Footer />