Merge pull request #46 from HiEventsDev/develop

Merge develop into main

Author: daveearley

.github/pull_request_template.md

@@ -0,0 +1,13 @@
+Thank you for creating a PR! We appreciate your contribution to Hi.Events.
+
+To make the process as smooth as possible, please ensure you've read the [contributing guidelines](https://github.com/HiEventsDev/hi.events/blob/develop/CONTRIBUTING.md) before proceeding.
+
+Please include a summary of the changes and the issue being fixed or the feature being added. The more detail, the better!
+
+## Checklist
+
+- [ ] I have read the contributing guidelines.
+- [ ] My code is of good quality and follows the coding standards of the project.
+- [ ] I have tested my changes, and they work as expected.
+
+Thank you for your contribution! 🎉

.github/workflows/cla.yml

@@ -0,0 +1,30 @@
+name: "CLA Assistant"
+on:
+  issue_comment:
+    types: [created]
+  pull_request_target:
+    types: [opened,closed,synchronize]
+
+permissions:
+  actions: write
+  contents: read
+  pull-requests: write
+  statuses: write
+
+jobs:
+  CLAAssistant:
+    runs-on: ubuntu-latest
+    steps:
+      - name: "CLA Assistant"
+        if: (github.event.comment.body == 'recheck' || github.event.comment.body == 'I have read the CLA Document and I hereby sign the CLA') || github.event_name == 'pull_request_target'
+        uses: contributor-assistant/[email protected]
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          PERSONAL_ACCESS_TOKEN: ${{ secrets.PERSONAL_ACCESS_TOKEN }}
+        with:
+          path-to-signatures: 'signatures.json'
+          path-to-document: 'https://github.com/HiEventsDev/hi.events/blob/develop/CLA.md'
+          branch: 'main'
+          allowlist: daveearley,bot*
+          remote-organization-name: HiEventsDev
+          remote-repository-name: cla-signatures

CLA.md

@@ -0,0 +1,23 @@
+# Hi.Events Contributor License Agreement
+
+Thank you for your interest in contributing to Hi.Events!
+
+Like many open source projects, we ask you to please sign this Contributor License Agreement (CLA) to confirm that you have the rights to your contributions and grant us the necessary permissions to use them. This helps us manage the project effectively and offer both open-source and commercial licenses.
+
+**Contributor License Agreement**
+
+This Contributor License Agreement ("Agreement") documents the rights granted by contributors to Hi.Event Ltd. ("Company"). To make this a binding legal agreement, please review the following terms and sign below.
+
+You hereby grant to Hi.Event Ltd. a perpetual, worldwide, non-exclusive, no-charge, royalty-free, irrevocable license to use, modify, reproduce, distribute, and sublicense your contributions under the terms of both the GNU Affero General Public License version 3 (AGPL-3.0) and a commercial license, without any compensation to you.
+
+You confirm that:
+
+1. Each contribution is an original creation of yours and that you have the right to grant the licenses stated above.
+2. Your contributions do not infringe any third-party copyrights, patents, trademarks, or other rights.
+3. You will notify Hi.Event Ltd. of any facts or circumstances of which you become aware that would make your representations in this Agreement inaccurate in any respect.
+
+For more details on how to contribute, please read our [Contribution Guidelines](https://github.com/HiEventsDev/hi.events/blob/develop/CONTRIBUTING.md).
+
+Before contributing to Hi.Events, you must accept and agree to the terms of this Agreement.
+
+Thank you for your contributions and support!

CONTRIBUTING.md

@@ -53,6 +53,10 @@ Please ensure that your pull request includes:
 - Tests for new functionality or bug fixes, if applicable.
 - A demo or screenshots, if the changes are visual.
 
+Once you create a pull request, a CLA bot will automatically check if you have signed the Contributor License Agreement (CLA). 
+Signing is as simple as leaving a comment on the pull request with the message `I have read the CLA Document and I hereby sign the CLA`.
+We require all contributors to sign the CLA to ensure that we have the necessary permissions to use and distribute your contributions.
+
 ## Development Setup
 
 To set up the development environment for Hi.Events, follow the detailed instructions in our [Getting Started with Local Development guide](https://hi.events/docs/getting-started/local-development).

frontend/src/components/common/OrdersTable/index.tsx

@@ -14,7 +14,7 @@ import {
 import {prettyDate, relativeDate} from "../../../utilites/dates.ts";
 import {ViewOrderModal} from "../../modals/ViewOrderModal";
 import {useDisclosure} from "@mantine/hooks";
-import {useEffect, useState} from "react";
+import {useState} from "react";
 import {CancelOrderModal} from "../../modals/CancelOrderModal";
 import {SendMessageModal} from "../../modals/SendMessageModal";
 import {notifications} from "@mantine/notifications";
@@ -28,6 +28,7 @@ import {ShowForDesktop, ShowForMobile} from "../Responsive/ShowHideComponents.ts
 import {useResendOrderConfirmation} from "../../../mutations/useResendOrderConfirmation.ts";
 import {OrderStatusBadge} from "../OrderStatusBadge";
 import {formatNumber} from "../../../utilites/helpers.ts";
+import {useUrlHash} from "../../../hooks/useUrlHash.ts";
 
 interface OrdersTableProps {
     event: Event,
@@ -42,17 +43,11 @@ export const OrdersTable = ({orders, event}: OrdersTableProps) => {
     const [orderId, setOrderId] = useState<IdParam>();
     const resendConfirmationMutation = useResendOrderConfirmation();
 
-    useEffect(() => {
-        if (window?.location.hash) {
-            const match = window?.location.hash.match(/^#order-(\d+)$/);
-
-            if (match && match[1]) {
-                const orderId = match[1];
-                setOrderId(orderId);
-                viewModal.open();
-            }
-        }
-    }, []);
+    useUrlHash(/^#order-(\d+)$/, (matches => {
+        const orderId = matches![1];
+        setOrderId(orderId);
+        viewModal.open();
+    }));
 
     if (orders.length === 0) {
         return <NoResultsSplash

frontend/src/components/common/PromoCodeTable/index.tsx

@@ -12,6 +12,7 @@ import {useState} from "react";
 import {NoResultsSplash} from "../NoResultsSplash";
 import {confirmationDialog} from "../../../utilites/confirmationDialog.tsx";
 import {useDeletePromoCode} from "../../../mutations/useDeletePromoCode.ts";
+import {eventHomepageUrl} from "../../../utilites/urlHelper.ts";
 
 interface PromoCodeTableProps {
     event: Event,
@@ -23,6 +24,7 @@ export const PromoCodeTable = ({event, promoCodes, openCreateModal}: PromoCodeTa
     const [promoCodeId, setPromoCodeId] = useState<number | undefined>();
     const [editModalOpen, {open: openEditModal, close: closeEditModal}] = useDisclosure(false);
     const deleteMutation = useDeletePromoCode();
+    const clipboard = useClipboard({ timeout: 500 });
 
     const handleEditModal = (promoCodeId: number | undefined) => {
         setPromoCodeId(promoCodeId);
@@ -168,6 +170,8 @@ export const PromoCodeTable = ({event, promoCodes, openCreateModal}: PromoCodeTa
                                                 </Menu.Item>
                                                 <Menu.Item leftSection={<IconCopy size={14}/>}
                                                            onClick={() => {
+                                                                clipboard.copy(eventHomepageUrl(event) + `?promo_code=${code?.code}`);
+                                                                showSuccess(t`URL copied to clipboard`)
                                                            }}>
                                                     {t`Copy URL`}
                                                 </Menu.Item>

frontend/src/components/layouts/Event/Event.module.scss

@@ -41,7 +41,7 @@
     transition: box-shadow 0.3s ease;
     position: sticky;
     top: 0;
-    box-shadow: 0 5px 5px 0 #00000010;
+    box-shadow: 0 5px 5px 0 #00000005;
     z-index: 1;
 
     .breadcrumbs {

frontend/src/components/routes/event/GettingStarted/index.tsx

@@ -69,7 +69,7 @@ const GettingStarted = () => {
                             {t`Create tickets for your event, set prices, and manage available quantity.`}
                         </p>
 
-                        <Button variant={'light'} component={'a'} href={'/manage/event/' + eventId + '/tickets'}>
+                        <Button variant={'light'} component={'a'} href={'/manage/event/' + eventId + '/tickets#create-ticket'}>
                             {hasTickets ? t`Add More tickets` : t`Add tickets`}
                         </Button>
 

frontend/src/components/routes/event/tickets.tsx

@@ -14,6 +14,7 @@ import {useGetTickets} from "../../../queries/useGetTickets.ts";
 import {TableSkeleton} from "../../common/TableSkeleton";
 import {Pagination} from "../../common/Pagination";
 import {t} from "@lingui/macro";
+import {useUrlHash} from "../../../hooks/useUrlHash.ts";
 
 export const Tickets = () => {
     const [searchParams, setSearchParams] = useFilterQueryParamSync();
@@ -23,12 +24,14 @@ export const Tickets = () => {
     const pagination = ticketsQuery?.data?.meta;
     const tickets = ticketsQuery?.data?.data;
     const enableSorting =
-        (Object.keys(searchParams).length === 0) || // searchParams is an empty object
+        (Object.keys(searchParams).length === 0) ||
         (
-            (searchParams.sortBy === 'order' || searchParams.sortBy === undefined) && // orderBy is 'order' or undefined
-            (searchParams.query === '' || searchParams.query === undefined) // query is an empty string or undefined
+            (searchParams.sortBy === 'order' || searchParams.sortBy === undefined) &&
+            (searchParams.query === '' || searchParams.query === undefined)
         );
 
+    useUrlHash('create-ticket', () => openCreateModal());
+
     return (
         <PageBody>
             <PageTitle>{t`Tickets`}</PageTitle>

frontend/src/components/routes/ticket-widget/SelectTickets/index.tsx

@@ -345,49 +345,46 @@ const SelectTickets = (props: SelectTicketsProps) => {
                     </div>
                 </form>
             )}
-
-            {ticketAreAvailable && (
-                <div className={'hi-promo-code-row'}>
-                    {(!showPromoCodeInput && !form.values.promo_code) && (
-                        <Anchor className={'hi-have-a-promo-code-link'}
-                                onClick={() => setShowPromoCodeInput(true)}>
-                            {t`Have a promo code?`}
-                        </Anchor>
-                    )}
-                    {form.values.promo_code && (
-                        <div className={'hi-promo-code-applied'}>
-                            <span><b>{form.values.promo_code}</b> {t`applied`}</span>
-                            <ActionIcon
-                                className={'hi-promo-code-applied-remove-icon-button'}
-                                variant="transparent"
-                                aria-label={t`remove`}
-                                title={t`Remove`}
-                                onClick={() => {
-                                    promoCodeEventRefetchMutation.mutate(null)
-                                }}
-                            >
-                                <IconX stroke={1.5} size={20}/>
-                            </ActionIcon>
-                        </div>
-                    )}
-                    {(showPromoCodeInput && !form.values.promo_code) && (
-                        <Group className={'hi-promo-code-input-wrapper'} wrap={'nowrap'} gap={'20px'}>
-                            {/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
-                            {/*@ts-ignore*/}
-                            <TextInput autoFocus classNames={{input: 'hi-promo-code-input'}} onKeyDown={(event) => {
-                                if (event.key === 'Enter') {
-                                    event.preventDefault();
-                                    handleApplyPromoCode();
-                                }
-                            }} mb={0} ref={promoRef}/>
-                            <Button disabled={promoCodeEventRefetchMutation.isLoading}
-                                    className={'hi-apply-promo-code-button'} variant={'outline'}
-                                    onClick={handleApplyPromoCode}>
-                                {t`Apply Promo Code`}
-                            </Button>
-                        </Group>
-                    )}
-                </div>
+            <div className={'hi-promo-code-row'}>
+                {(!showPromoCodeInput && !form.values.promo_code) && (
+                    <Anchor className={'hi-have-a-promo-code-link'}
+                            onClick={() => setShowPromoCodeInput(true)}>
+                        {t`Have a promo code?`}
+                    </Anchor>
+                )}
+                {form.values.promo_code && (
+                    <div className={'hi-promo-code-applied'}>
+                        <span><b>{form.values.promo_code}</b> {t`applied`}</span>
+                        <ActionIcon
+                            className={'hi-promo-code-applied-remove-icon-button'}
+                            variant="transparent"
+                            aria-label={t`remove`}
+                            title={t`Remove`}
+                            onClick={() => {
+                                promoCodeEventRefetchMutation.mutate(null)
+                            }}
+                        >
+                            <IconX stroke={1.5} size={20}/>
+                        </ActionIcon>
+                    </div>
+                )}
+            </div>
+            {(showPromoCodeInput && !form.values.promo_code) && (
+                <Group className={'hi-promo-code-input-wrapper'} wrap={'nowrap'} gap={'20px'}>
+                    {/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
+                    {/*@ts-ignore*/}
+                    <TextInput autoFocus classNames={{input: 'hi-promo-code-input'}} onKeyDown={(event) => {
+                        if (event.key === 'Enter') {
+                            event.preventDefault();
+                            handleApplyPromoCode();
+                        }
+                    }} mb={0} ref={promoRef}/>
+                    <Button disabled={promoCodeEventRefetchMutation.isLoading}
+                            className={'hi-apply-promo-code-button'} variant={'outline'}
+                            onClick={handleApplyPromoCode}>
+                        {t`Apply Promo Code`}
+                    </Button>
+                </Group>
             )}
             {
                 /**