@teamvortexsoftware/vortex-react-native 0.0.1 → 0.0.2

package/package.json

@@ -2,10 +2,13 @@
   "name": "@teamvortexsoftware/vortex-react-native",
   "description": "",
   "author": "@teamvortexsoftware",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "publishConfig": {
     "access": "restricted"
   },
+  "files": [
+    "dist"
+  ],
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "devDependencies": {

package/src/button.tsx

@@ -1,42 +0,0 @@
-import React, { useEffect, useState } from "react";
-import { Pressable, StyleSheet, Text } from "react-native";
-
-export interface ButtonProps {
-  text: string;
-  onClick?: (e: any) => void;
-}
-
-export function Button({ text, onClick }: ButtonProps) {
-  const [count, setCount] = useState(0);
-
-  useEffect(() => {
-    console.log("Current count:", count);
-  }, [count]);
-
-  const handlePress = (e: any) => {
-    console.log("handlePress called");
-    setCount((prevCount) => prevCount + 1);
-    if (onClick) {
-      onClick(e);
-    }
-  };
-
-  return <Text style={styles.text}>{text}</Text>;
-}
-
-const styles = StyleSheet.create({
-  button: {
-    maxWidth: 200,
-    textAlign: "center",
-    borderRadius: 10,
-    paddingTop: 14,
-    paddingBottom: 14,
-    paddingLeft: 30,
-    paddingRight: 30,
-    fontSize: 15,
-    backgroundColor: "#2f80ed",
-  },
-  text: {
-    color: "white",
-  },
-});

package/src/index.tsx

@@ -1,2 +0,0 @@
-export { Button, type ButtonProps } from "./button";
-export { VortexInvite, type VortexInviteProps } from "./vortexInvite";

package/src/shared/api.ts

@@ -1,24 +0,0 @@
-class VortexClient {
-  private host: string;
-
-  constructor(host: string) {
-    this.host = host;
-  }
-
-  async getWidgetConfiguration(widgetConfigurationId: string) {
-    const response = await fetch(
-      `${this.host}/api/v1/no-auth/components/widget-configuration/${widgetConfigurationId}`,
-    );
-
-    if (!response.ok) {
-      throw new Error(
-        `Error fetching widget configuration: ${response.statusText}`,
-      );
-    }
-
-    const data = await response.json();
-    return data;
-  }
-}
-
-export default VortexClient;

package/src/vortexInvite.tsx

@@ -1,453 +0,0 @@
-import React, { useEffect, useMemo, useState } from "react";
-import {
-  View,
-  Text,
-  TextInput,
-  Button,
-  TouchableOpacity,
-  StyleSheet,
-  ActivityIndicator,
-  Alert,
-  Linking,
-  Share,
-  ScrollView,
-  Modal,
-  Pressable,
-  Animated,
-} from "react-native";
-import VortexClient from "./shared/api";
-// import Clipboard from "@react-native-clipboard/clipboard";
-// import QRCode from "react-native-qrcode-svg";
-// import Icon from "react-native-vector-icons/FontAwesome";
-
-interface WidgetConfiguration {
-  configuration?: {
-    props?: any;
-    styles?: any;
-  };
-  slug?: string;
-  [key: string]: any;
-}
-
-export interface VortexInviteProps {
-  widgetConfigurationId?: string;
-  widgetConfiguration?: WidgetConfiguration;
-  isLoading?: boolean;
-}
-
-export function VortexInvite({
-  widgetConfigurationId,
-  widgetConfiguration,
-  isLoading = false,
-}: VortexInviteProps) {
-  // TODO - Remove this hardcoded host
-  // const host = "http://localhost:3003";
-  // if (host.indexOf("localhost") > -1) {
-  //   console.warn("Vortex:Invite Using localhost as host");
-  // }
-
-  // const vortex = new VortexClient(host);
-
-  // const [widgetConfiguration_INTERNAL, setWidgetConfiguration] = useState<
-  //   any | null
-  // >(widgetConfiguration ?? null);
-  // const [error, setError] = useState<{ message: string } | null>(null);
-  // const [fetching, setFetching] = useState(isLoading); // Start fetching if isLoading is true
-  // const [loading, setLoading] = useState(true);
-
-  // const [email, setEmail] = useState("");
-
-  // const opacity = new Animated.Value(0.3);
-
-  // useEffect(() => {
-  //   const animation = Animated.loop(
-  //     Animated.sequence([
-  //       Animated.timing(opacity, {
-  //         toValue: 1,
-  //         duration: 1000,
-  //         useNativeDriver: true,
-  //       }),
-  //       Animated.timing(opacity, {
-  //         toValue: 0.3,
-  //         duration: 1000,
-  //         useNativeDriver: true,
-  //       }),
-  //     ]),
-  //   );
-  //   animation.start();
-
-  //   setTimeout(() => {
-  //     setLoading(false);
-  //     animation.stop();
-  //   }, 2000);
-  // }, []);
-
-  // useEffect(() => {
-  //   if (widgetConfiguration && Object.keys(widgetConfiguration).length > 0) {
-  //     console.debug("Vortex:Invite Using provided widgetConfiguration");
-  //     setWidgetConfiguration(widgetConfiguration);
-  //     setFetching(false);
-  //     setError(null); // Clear any errors if valid data arrives
-  //     setLoading(false);
-  //   }
-  // }, [widgetConfiguration]);
-
-  // useEffect(() => {
-  //   // Case: If `widgetConfiguration_INTERNAL` is already set, do nothing
-  //   if (widgetConfiguration_INTERNAL) {
-  //     console.debug(
-  //       "Vortex:Invite Already has widgetConfiguration, skipping fetch",
-  //     );
-  //     return;
-  //   }
-
-  //   // Case: No `widgetConfigurationId` and no `widgetConfiguration`, WAIT for updates instead of erroring
-  //   if (!widgetConfigurationId) {
-  //     console.debug("Vortex:Invite Waiting for widgetConfigurationId...");
-  //     return;
-  //   }
-
-  //   // **API Fetching Logic**
-  //   const fetchData = async (widgetConfigurationId: any | string) => {
-  //     console.debug("Vortex:Invite Fetching Data...");
-  //     setFetching(true);
-  //     setLoading(true);
-  //     setError(null);
-
-  //     try {
-  //       const result = await vortex.getWidgetConfiguration(
-  //         widgetConfigurationId,
-  //       );
-  //       if (result?.data?.widgetConfiguration) {
-  //         setWidgetConfiguration(result.data.widgetConfiguration);
-  //         console.debug(
-  //           "Vortex:Invite Successfully fetched widgetConfiguration",
-  //         );
-  //       } else {
-  //         const error = result?.error || "No configuration data found.";
-  //         console.error(`Vortex:Invite ${error}`);
-  //         throw new Error(error);
-  //       }
-  //     } catch (err) {
-  //       setError({
-  //         message: (err as Error).message || "Something went wrong!",
-  //       });
-  //     } finally {
-  //       setFetching(false);
-  //       setLoading(false);
-  //     }
-  //   };
-
-  //   fetchData(widgetConfigurationId);
-  // }, [widgetConfigurationId]);
-
-  // const options = useMemo(() => {
-  //   return widgetConfiguration_INTERNAL?.configuration?.props || {};
-  // }, [widgetConfiguration_INTERNAL]);
-
-  // const has = useMemo(() => {
-  //   const features: string[] = Array.isArray(
-  //     widgetConfiguration_INTERNAL?.configuration?.props?.features?.value,
-  //   )
-  //     ? widgetConfiguration_INTERNAL?.configuration?.props?.features?.value
-  //     : [];
-
-  //   const shareOptions: string[] = Array.isArray(
-  //     widgetConfiguration_INTERNAL?.configuration?.props?.shareOptions?.value,
-  //   )
-  //     ? widgetConfiguration_INTERNAL?.configuration?.props?.shareOptions?.value
-  //     : [];
-  //   return {
-  //     shareableLinks: features.includes("shareableLinks"),
-  //     emailInvitations: features.includes("emailInvitations"),
-  //     shareOptionsCopyLink: shareOptions.includes("copyLink"),
-  //     shareOptionsSms: shareOptions.includes("sms"),
-  //     shareOptionsFacebook: shareOptions.includes("facebook"),
-  //     shareOptionsFacebookMessenger: shareOptions.includes("facebookMessenger"),
-  //     shareOptionsWhatsApp: shareOptions.includes("whatsApp"),
-  //     shareOptionsQrCode: shareOptions.includes("qrCode"),
-  //     shareOptionsNativeShareSheet: shareOptions.includes("nativeShareSheet"),
-  //   };
-  // }, [widgetConfiguration_INTERNAL]);
-
-  // const shareOptions: {
-  //   condition: boolean;
-  //   // tooltip: string | JSX.Element;
-  //   // icon: JSX.Element;
-  //   // eslint-disable-next-line no-unused-vars
-  //   // onClick: (e: any) => void;
-  //   label: string;
-  // }[] = [
-  //   {
-  //     condition: has.shareOptionsCopyLink,
-  //     // tooltip: showCopiedToClipboardTooltip
-  //     //    ? "Copied to clipboard!"
-  //     //   : "Copy to clipboard",
-  //     //  icon: <LinkIcon />,
-  //     // onClick: handleCopyToClipboard,
-  //     label: "Copy Link",
-  //   },
-  //   {
-  //     condition: has.shareOptionsSms,
-  //     // tooltip: "Share via SMS",
-  //     //  // icon: <SmsIcon />,
-  //     //   onClick: (e: any) => {
-  //     //     e.preventDefault();
-  //     //     window.open(`sms:?body=${globallyShareableLink}`, "_blank");
-  //     //   },
-  //     label: "SMS",
-  //   },
-  //   {
-  //     condition: has.shareOptionsFacebook,
-  //     // tooltip: "Share on Facebook",
-  //     // icon: <FacebookIcon />,
-  //     // onClick: (e: any) => {
-  //     //   e.preventDefault();
-  //     //   window.open(
-  //     //     `https://www.facebook.com/sharer/sharer.php?u=${globallyShareableLink}`,
-  //     //     "_blank",
-  //     //   );
-  //     // },
-  //     label: "Facebook",
-  //   },
-  //   {
-  //     condition: has.shareOptionsFacebookMessenger,
-  //     // tooltip: "Share on Facebook Messenger",
-  //     // icon: <FacebookIcon />,
-  //     // onClick: (e: any) => {
-  //     //   e.preventDefault();
-  //     //   window.open(`https://m.me/?text=${globallyShareableLink}`, "_blank");
-  //     // },
-  //     label: "Messenger",
-  //   },
-  //   {
-  //     condition: has.shareOptionsWhatsApp,
-  //     // tooltip: "Share on WhatsApp",
-  //     // icon: <WhatsAppIcon />,
-  //     // onClick: (e: any) => {
-  //     //   e.preventDefault();
-  //     //   window.open(`https://wa.me/?text=${globallyShareableLink}`, "_blank");
-  //     // },
-  //     label: "WhatsApp",
-  //   },
-  //   {
-  //     condition: has.shareOptionsQrCode,
-  //     // tooltip: globallyShareableLink ? (
-  //     //   <QRCode value={globallyShareableLink} size={100} />
-  //     // ) : (
-  //     //   "No shareable link"
-  //     // ),
-  //     // icon: <QrCodeIcon />,
-  //     // onClick: (e: any) => {
-  //     //   e.preventDefault();
-  //     // },
-  //     label: "QR Code",
-  //   },
-  //   {
-  //     condition: has.shareOptionsNativeShareSheet,
-  //     // tooltip: "Share via native share",
-  //     // icon: <PendingIcon />,
-  //     // onClick: handleShareSheetClick,
-  //     label: "Native Share",
-  //   },
-  // ];
-
-  // const handleInviteClick = async () => {
-  //   try {
-  //     const response = await fetch(
-  //       `${options.host}/api/v1/no-auth/components/widget-configuration/${options.widgetConfigurationId}/invite`,
-  //       {
-  //         method: "POST",
-  //         headers: {
-  //           "Content-Type": "application/json",
-  //         },
-  //         body: JSON.stringify({ to: [{ email }] }),
-  //       },
-  //     );
-  //     const body = await response.json();
-  //     console.log(body);
-  //     Alert.alert(
-  //       "Invitation Sent",
-  //       "Your invitation has been successfully sent.",
-  //     );
-  //   } catch (error) {
-  //     console.error(error);
-  //     Alert.alert("Error", "Failed to send invitation.");
-  //   }
-  // };
-
-  return (
-    <View>
-      <pre>Chupacabra</pre>
-    </View>
-  );
-  // if (error?.message) {
-  //   return <pre data-testid="error">{error.message}</pre>;
-  // }
-
-  // if (fetching || loading) {
-  //   return <Animated.View style={[styles.skeleton, { opacity }]} />;
-  // }
-
-  // return (
-  //   <>
-  //     <View style={[styles.container, options.widget?.style]}>
-  //       {has?.emailInvitations && (
-  //         <View style={styles.inviteContainer}>
-  //           {options.emailIntroCopy?.value && (
-  //             <Text style={styles.introText}>
-  //               {options.emailIntroCopy?.value}
-  //             </Text>
-  //           )}
-  //           <TextInput
-  //             style={styles.input}
-  //             placeholder="Enter email"
-  //             value={email}
-  //             onChangeText={setEmail}
-  //             {...(options?.emailInput?.attributes || {})}
-  //           />
-  //           <View style={styles.buttonContainer}>
-  //             <TouchableOpacity
-  //               style={[styles.submitButton, options.submitButton?.style]}
-  //               onPress={handleInviteClick}
-  //             >
-  //               <Text style={styles.submitButtonText}>
-  //                 {options.submitButton?.value || "Send invitation"}
-  //               </Text>
-  //             </TouchableOpacity>
-  //           </View>
-  //         </View>
-  //       )}
-
-  //       {has?.shareableLinks && (
-  //         <View style={styles.shareContainer}>
-  //           {has?.emailInvitations ? (
-  //             options.shareableInviteText ? (
-  //               <Text style={styles.divider}>
-  //                 {options.shareableInviteText?.value}
-  //               </Text>
-  //             ) : (
-  //               <Text style={styles.divider}>OR</Text>
-  //             )
-  //           ) : options.hasAnyShareableLinks ? (
-  //             <Text style={styles.divider}>OR</Text>
-  //           ) : null}
-
-  //           <View style={styles.shareButtonsContainer}>
-  //             {shareOptions
-  //               ?.filter((_) => !!_.condition)
-  //               .map(({ label }, index, arr) => (
-  //                 <View
-  //                   key={index}
-  //                   style={
-  //                     arr.length % 2 !== 0 && index === arr.length - 1
-  //                       ? styles.centeredShareButton
-  //                       : styles.shareButtonWrapper
-  //                   }
-  //                 >
-  //                   <TouchableOpacity
-  //                     style={styles.shareButton}
-  //                     // onPress={onClick}
-  //                   >
-  //                     <Text style={styles.shareButtonText}>{label}</Text>
-  //                   </TouchableOpacity>
-  //                 </View>
-  //               ))}
-  //           </View>
-  //         </View>
-  //       )}
-  //     </View>
-  //   </>
-  // );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    padding: 15,
-    display: "flex",
-    flexDirection: "column",
-  },
-  inviteContainer: {
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center",
-    alignItems: "center",
-    marginTop: 8,
-  },
-  introText: {
-    marginBottom: 8,
-    fontSize: 24,
-    fontWeight: "bold",
-    textAlign: "center",
-  },
-  input: {
-    width: "100%",
-    borderWidth: 1,
-    borderColor: "#ccc",
-    padding: 10,
-    borderRadius: 5,
-    marginBottom: 8,
-  },
-  buttonContainer: {
-    marginTop: 16,
-    marginBottom: 8,
-    width: "100%",
-  },
-  submitButton: {
-    // backgroundColor: "#007bff",
-    padding: 12,
-    borderRadius: 5,
-    alignItems: "center",
-    shadowColor: "rgba(0, 0, 0, 0.2)",
-    shadowOffset: { width: 0, height: 2 },
-    shadowOpacity: 0.5,
-    shadowRadius: 2,
-  },
-  submitButtonText: {
-    color: "white",
-    fontWeight: "500",
-    textTransform: "none",
-  },
-  skeleton: {
-    width: "100%",
-    height: 50,
-    backgroundColor: "#e0e0e0",
-    borderRadius: 5,
-  },
-  shareContainer: {
-    marginTop: 16,
-    alignItems: "center",
-  },
-  divider: {
-    marginVertical: 10,
-    fontSize: 16,
-    fontWeight: "bold",
-    textAlign: "center",
-  },
-  shareButtonsContainer: {
-    flexDirection: "row",
-    flexWrap: "wrap",
-    justifyContent: "center",
-  },
-  shareButtonWrapper: {
-    width: "48%",
-    margin: 5,
-  },
-  centeredShareButton: {
-    width: "100%",
-    alignItems: "center",
-  },
-  shareButton: {
-    flexDirection: "row",
-    alignItems: "center",
-    padding: 10,
-    borderWidth: 1,
-    borderColor: "#007bff",
-    borderRadius: 5,
-    justifyContent: "center",
-  },
-  shareButtonText: {
-    paddingLeft: 10,
-    color: "#007bff",
-  },
-});

package/tsconfig.json

@@ -1,8 +0,0 @@
-{
-  "extends": "@teamvortexsoftware/typescript-config/react-native-library",
-  "include": ["."],
-  "exclude": ["dist", "build", "node_modules"],
-  "compilerOptions": {
-    "strict": true
-  }
-}

package/tsup.config.ts

@@ -1,15 +0,0 @@
-import { defineConfig, Options } from "tsup";
-
-export default defineConfig((options: Options) => ({
-  entry: {
-    index: "src/index.tsx",
-  },
-  banner: {
-    js: "'use client'",
-  },
-  clean: true,
-  format: ["cjs", "esm"],
-  external: ["react"],
-  dts: true,
-  ...options,
-}));