@eventlook/sdk 1.4.46-beta.2 → 1.4.46-beta.3

package/src/form/ScriptLoader.tsx

@@ -1,19 +0,0 @@
-import React from 'react';
-import { useEffect } from 'react';
-
-const ScriptLoader: React.FC = () => {
-  useEffect(() => {
-    const script = document.createElement('script');
-    script.src = 'https://widget.packeta.com/v6/www/js/library.js';
-    script.async = true;
-    document.body.appendChild(script);
-
-    return () => {
-      document.body.removeChild(script);
-    };
-  }, []);
-
-  return null;
-};
-
-export default ScriptLoader;

package/src/form/Shipping.tsx

@@ -1,226 +0,0 @@
-import React, { useEffect, useMemo, useState } from 'react';
-import useEventShippingMethods from '@hooks/data/useEventShippingMethods';
-import { IEvent } from '@utils/types/event.type';
-import ShippingSkeleton from '@form/shipping/ShippingSkeleton';
-import {
-  Box,
-  Button,
-  FormControl,
-  FormControlLabel,
-  FormHelperText,
-  Radio,
-  RadioGroup,
-  Stack,
-  Typography,
-} from '@mui/material';
-import { ShippingMethodItem } from '@form/style';
-import { Iconify } from '@components/iconify';
-import { Controller, useFormContext, useWatch } from 'react-hook-form';
-import { ITicketForm, ITicketFormTicket } from '@utils/types/ticket.type';
-import { ShippingTypes } from '@utils/data/shipping-method';
-import useGlobal from '@hooks/useGlobal';
-import ScriptLoader from '@form/ScriptLoader';
-import { IEventProductForm } from '@utils/types/product.type';
-
-interface Props {
-  event: IEvent;
-}
-
-const Shipping: React.FC<Props> = ({ event }) => {
-  const { t, lang, options } = useGlobal();
-  const { data: shippingMethods, isLoading } = useEventShippingMethods(event.id, {
-    currency: event.currency,
-  });
-  const { control, watch, setValue } = useFormContext<ITicketForm>();
-  const tickets: Record<string, ITicketFormTicket[]> = useWatch({
-    name: 'tickets',
-    defaultValue: {},
-  });
-  const flatTickets: ITicketFormTicket[] = useMemo(() => Object.values(tickets).flat(), [tickets]);
-  const products: Record<string, IEventProductForm[]> = useWatch({
-    name: 'products',
-    defaultValue: {},
-  });
-  const flatProducts: IEventProductForm[] = useMemo(
-    () => Object.values(products).flat(),
-    [products]
-  );
-  const shippingMethodId = watch('shipping.shippingMethodId');
-  const branchId = watch('shipping.branchId');
-  const [displayBranchName, setDisplayBranchName] = useState<string | null>(null);
-  const [firstRender, setFirstRender] = useState<boolean>(true);
-  const filteredShippingMethods = useMemo(
-    () =>
-      shippingMethods?.filter(
-        (shippingMethod) =>
-          !flatProducts?.find((product) =>
-            product.excludedShippingMethodIds?.includes(shippingMethod?.id)
-          ) &&
-          !flatTickets.find((ticket) =>
-            ticket.products.find((product) =>
-              product.excludedShippingMethodIds?.includes(shippingMethod?.id)
-            )
-          )
-      ),
-    [shippingMethods, shippingMethodId, flatTickets, flatProducts]
-  );
-
-  const paymentImages = {
-    [ShippingTypes.PACKETA]: (
-      <Iconify icon="arcticons:packeta" color="rgb(186,27,2)" width={32} height={32} />
-    ),
-    [ShippingTypes.PICK_UP]: <Iconify icon="flowbite:store-solid" width={32} height={32} />,
-  };
-
-  const onSelectBranch = (branch: any) => {
-    if (branch) {
-      setValue('shipping.branchId', branch.id);
-      setDisplayBranchName(branch.name);
-    } else {
-      setValue('shipping.shippingMethodId', null);
-      setValue('shipping.branchId', null);
-      setDisplayBranchName(null);
-    }
-  };
-
-  const handleChangeBranch = () => {
-    setValue('shipping.branchId', null);
-    setDisplayBranchName(null);
-  };
-
-  useEffect(() => {
-    if (firstRender && filteredShippingMethods.length === 1) {
-      setValue('shipping.shippingMethodId', filteredShippingMethods[0].id);
-      setFirstRender(false);
-    }
-  }, [firstRender, filteredShippingMethods]);
-
-  useEffect(() => {
-    const selectedShippingMethod = shippingMethods.find(
-      (method) => method.id === Number(shippingMethodId)
-    );
-
-    if (selectedShippingMethod) {
-      setValue('shipping.price', selectedShippingMethod.price);
-
-      if (selectedShippingMethod.type === ShippingTypes.PACKETA) {
-        if (!branchId) {
-          const interval = setInterval(() => {
-            if (window.Packeta && window.Packeta.Widget) {
-              clearInterval(interval);
-              window.Packeta.Widget.pick(options?.packetaApiKey, onSelectBranch, {
-                language: lang,
-              });
-            }
-          }, 100);
-        }
-      } else {
-        setValue('shipping.branchId', null);
-        setDisplayBranchName(null);
-      }
-    } else {
-      setValue('shipping.price', 0);
-    }
-  }, [shippingMethodId, shippingMethods, branchId]);
-
-  return (
-    <>
-      <ScriptLoader />
-      <div>
-        {isLoading ? (
-          <ShippingSkeleton />
-        ) : (
-          <>
-            {filteredShippingMethods.length === 0 ? (
-              <Typography variant="h4" color="error">
-                {t('event.tickets.stepper.5.error')}
-              </Typography>
-            ) : (
-              <>
-                <Controller
-                  name="shipping.shippingMethodId"
-                  control={control}
-                  render={({ field, fieldState: { error } }) => (
-                    <FormControl component="fieldset" sx={{ width: '100%' }}>
-                      <RadioGroup {...field}>
-                        {filteredShippingMethods.map((shippingMethod) => (
-                          <ShippingMethodItem
-                            key={shippingMethod.id}
-                            active={Number(shippingMethodId) === shippingMethod.id}
-                          >
-                            <FormControlLabel
-                              value={shippingMethod.id}
-                              control={<Radio />}
-                              label={
-                                <Stack
-                                  direction="row"
-                                  justifyContent="space-between"
-                                  alignItems="center"
-                                  width="100%"
-                                >
-                                  <Stack direction="row" alignItems="center">
-                                    <Box
-                                      sx={{
-                                        marginRight: 2,
-                                      }}
-                                    >
-                                      <Typography sx={{ lineHeight: 1.2 }}>
-                                        {t(`shipping_method.types.${shippingMethod.type}`)}
-                                      </Typography>
-                                      {displayBranchName &&
-                                        shippingMethod.type === ShippingTypes.PACKETA &&
-                                        shippingMethod.id === Number(shippingMethodId) && (
-                                          <Typography variant="caption" sx={{ lineHeight: 1 }}>
-                                            {displayBranchName}
-                                          </Typography>
-                                        )}
-                                    </Box>
-                                    {paymentImages[shippingMethod.type]}
-                                  </Stack>
-                                  {shippingMethod.type === ShippingTypes.PACKETA &&
-                                    shippingMethod.id === Number(shippingMethodId) &&
-                                    branchId && (
-                                      <Box>
-                                        <Button
-                                          onClick={handleChangeBranch}
-                                          variant="outlined"
-                                          size="small"
-                                        >
-                                          {t('change')}
-                                        </Button>
-                                      </Box>
-                                    )}
-                                </Stack>
-                              }
-                              sx={{
-                                '&:not(:last-of-type)': {
-                                  mb: 0,
-                                },
-                                '& .MuiFormControlLabel-label': {
-                                  width: '100%',
-                                  mr: 0,
-                                },
-                              }}
-                            />
-                          </ShippingMethodItem>
-                        ))}
-                      </RadioGroup>
-
-                      {!!error && (
-                        <FormHelperText error={!!error} sx={{ mx: 0 }}>
-                          {error?.message}
-                        </FormHelperText>
-                      )}
-                    </FormControl>
-                  )}
-                />
-              </>
-            )}
-          </>
-        )}
-      </div>
-    </>
-  );
-};
-
-export default Shipping;