@churchapps/apphelper 0.4.12 → 0.4.18

package/src/pageComponents/LogoutPage.tsx

@@ -1,43 +0,0 @@
-"use client";
-
-import React from "react";
-import { useCookies, CookiesProvider } from "react-cookie"
-import { ApiHelper, UserContextInterface } from "../helpers";
-
-interface Props { context?: UserContextInterface, handleRedirect?: (url: string) => void }
-
-const LogoutPageContent: React.FC<Props> = (props) => {
-	const [, , removeCookie] = useCookies(["jwt", "email", "name", "lastChurchId"]);
-
-	removeCookie("jwt");
-	removeCookie("email");
-	removeCookie("name");
-	removeCookie("lastChurchId");
-
-	ApiHelper.clearPermissions();
-	props.context?.setUser(null);
-	props.context?.setPerson(null);
-	props.context?.setUserChurches(null);
-	props.context?.setUserChurch(null);
-
-	setTimeout(() => {
-		// a must check for Nextjs
-		if (typeof window !== "undefined") {
-			// Use handleRedirect function if available, otherwise fallback to window.location
-			if (props.handleRedirect) {
-				props.handleRedirect("/");
-			} else {
-				window.location.href = "/";
-			}
-		}
-	}, 300);
-	return null;
-}
-
-export const LogoutPage: React.FC<Props> = (props) => {
-	return (
-		<CookiesProvider defaultSetOptions={{ path: '/' }}>
-			<LogoutPageContent {...props} />
-		</CookiesProvider>
-	);
-}

package/src/pageComponents/components/Forgot.tsx

@@ -1,81 +0,0 @@
-"use client";
-
-import React, { FormEventHandler } from "react";
-import { ApiHelper, Locale } from "../../helpers";
-import { ErrorMessages } from "../../components";
-import { ResetPasswordRequestInterface, ResetPasswordResponseInterface } from "@churchapps/helpers";
-import { Stack, TextField, Box, Typography } from "@mui/material";
-import LoadingButton from "@mui/lab/LoadingButton";
-
-interface Props {
-  registerCallback: () => void,
-  loginCallback: () => void
-}
-
-export const Forgot: React.FC<Props> = props => {
-  const [errors, setErrors] = React.useState([]);
-  const [successMessage, setSuccessMessage] = React.useState<React.ReactElement>(null);
-  const [email, setEmail] = React.useState("");
-  const [isSubmitting, setIsSubmitting] = React.useState(false);
-
-  const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>) => {
-    setEmail(e.target.value);
-  }
-
-  const validateEmail = (email: string) => (/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(.\w{2,3})+$/.test(email))
-
-  const validate = () => {
-    const result = [];
-    if (!email) result.push(Locale.label("login.validate.email"));
-    else if (!validateEmail(email)) result.push(Locale.label("login.validate.email"));
-    setErrors(result);
-    return result.length === 0;
-  }
-
-  const reset: FormEventHandler = (e) => {
-    e.preventDefault();
-    if (validate()) {
-      setIsSubmitting(true);
-      let req: ResetPasswordRequestInterface = { userEmail: email };
-      ApiHelper.postAnonymous("/users/forgot", req, "MembershipApi").then((resp: ResetPasswordResponseInterface) => {
-        if (resp.emailed) {
-          setErrors([]);
-          setSuccessMessage(
-            <Typography textAlign="center" marginTop="35px">
-              {Locale.label("login.resetSent")} <br /><br /><a href="about:blank" className="text-decoration" onClick={(e) => { e.preventDefault(); props.loginCallback(); }}>{Locale.label("login.goLogin")}</a>
-            </Typography>
-          );
-          setEmail("");
-        } else {
-          setErrors(["We could not find an account with this email address"]);
-          setSuccessMessage(<></>);
-        }
-      }).finally(() => { setIsSubmitting(false); });
-    }
-  }
-
-  return (
-    <Box id="loginBox" sx={{ backgroundColor: "#FFF", border: "1px solid #CCC", borderRadius: "5px", padding: "20px" }}>
-      <Typography component="h2" sx={{ fontSize: "32px", fontWeight: 500, lineHeight: 1.2, margin: "0 0 8px 0" }}>{Locale.label("login.resetPassword")}</Typography>
-
-      <form onSubmit={reset}>
-        <p>{Locale.label("login.resetInstructions")}</p>
-        <ErrorMessages errors={errors} />
-        {successMessage}
-        {!successMessage && (
-          <>
-            <TextField fullWidth autoFocus label={Locale.label("login.email")} aria-label="email" id="email" name="email" value={email} onChange={handleChange} placeholder={Locale.label("login.email")} onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => e.key === "Enter" && reset} />
-            <br />
-            <Box sx={{ textAlign: "right", marginY: 1 }}>
-              <a href="about:blank" className="text-decoration" onClick={(e) => { e.preventDefault(); props.registerCallback(); }}>{Locale.label("login.register")}</a> &nbsp; | &nbsp;
-              <a href="about:blank" className="text-decoration" onClick={(e) => { e.preventDefault(); props.loginCallback(); }}>{Locale.label("login.login")}</a>&nbsp;
-            </Box>
-            <Stack direction="row" sx={{ marginTop: 1.5 }} spacing={1} justifyContent="flex-end">
-              <LoadingButton loading={isSubmitting} variant="contained" type="submit" disabled={isSubmitting}>{Locale.label("login.reset")}</LoadingButton>
-            </Stack>
-          </>
-        )}
-      </form>
-    </Box>
-  );
-}

package/src/pageComponents/components/Login.tsx

@@ -1,62 +0,0 @@
-"use client";
-
-import React, { useState } from "react";
-import { InputBox } from "../../components";
-import { TextField, Box, PaperProps, InputAdornment, IconButton, Icon } from "@mui/material";
-import { Locale } from "../../helpers/Locale";
-
-interface Props {
-  //registerCallback: () => void,
-  //loginCallback: () => void
-  login: (data: any) => void,
-  isSubmitting: boolean,
-  setShowRegister: (showRegister: boolean) => void,
-  setShowForgot: (showForgot: boolean) => void,
-  setErrors: (errors: string[]) => void;
-  mainContainerCssProps?: PaperProps;
-  defaultEmail?: string;
-  defaultPassword?: string;
-}
-
-export const Login: React.FC<Props> = ({ mainContainerCssProps = {}, ...props }) => {
-  const [email, setEmail] = React.useState(props.defaultEmail || "");
-  const [password, setPassword] = React.useState(props.defaultPassword || "");
-  const [showPassword, setShowPassword] = useState(false);
-
-  const validateEmail = (email: string) => (/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(.\w{2,3})+$/.test(email))
-
-  const validate = () => {
-    const result = [];
-    if (!email) result.push(Locale.label("login.validate.email"));
-    else if (!validateEmail(email)) result.push(Locale.label("login.validate.email"));
-    if (!password) result.push(Locale.label("login.validate.password"));
-    props.setErrors(result);
-    return result.length === 0;
-  }
-
-  const submitLogin = () => {
-    if (validate()) props.login({ email, password });
-  }
-
-  const getRegisterLink = () => (
-    <><a href="about:blank" className="text-decoration" onClick={handleShowRegister}>{Locale.label("login.register")}</a> &nbsp; | &nbsp; </>
-  )
-
-  const handleShowRegister = (e: React.MouseEvent) => {
-    e.preventDefault();
-    props.setShowRegister(true);
-  }
-
-  return (
-    <InputBox headerText={Locale.label("login.signInTitle")} saveFunction={submitLogin} saveButtonType="submit" saveText={props.isSubmitting ? Locale.label("common.pleaseWait") : Locale.label("login.signIn")} isSubmitting={props.isSubmitting} mainContainerCssProps={mainContainerCssProps}>
-      <TextField fullWidth autoFocus name="email" type="email" label={Locale.label("login.email")} value={email} onChange={(e) => { e.preventDefault(); setEmail(e.target.value) }} />
-      <TextField fullWidth name="email" type={showPassword ? "text" : "password"} label={Locale.label("login.password")} value={password} onChange={(e) => { e.preventDefault(); setPassword(e.target.value) }}  InputProps={{
-        endAdornment: (<InputAdornment position="end"><IconButton aria-label="toggle password visibility" onClick={() => { setShowPassword(!showPassword) }}>{showPassword ? <Icon>visibility</Icon> : <Icon>visibility_off</Icon>}</IconButton></InputAdornment>)
-      }} />
-      <Box sx={{ textAlign: "right", marginY: 1 }}>
-        {getRegisterLink()}
-        <a href="about:blank" className="text-decoration" onClick={(e) => { e.preventDefault(); props.setShowForgot(true); }}>{Locale.label("login.forgot")}</a>&nbsp;
-      </Box>
-    </InputBox>
-  );
-}

package/src/pageComponents/components/LoginSetPassword.tsx

@@ -1,98 +0,0 @@
-"use client";
-
-import React, { useState } from "react";
-import { InputBox } from "../../components";
-import { Icon, IconButton, InputAdornment, TextField, Typography } from "@mui/material";
-import { LoginResponseInterface, UserInterface } from "@churchapps/helpers";
-import { ApiHelper, Locale } from "../../helpers";
-
-interface Props {
-  appName: string,
-  appUrl: string,
-  setErrors: (errors: string[]) => void,
-  setShowForgot: (showForgot: boolean) => void,
-  isSubmitting: boolean,
-  auth: string,
-  login: (data: any) => void,
-}
-
-export const LoginSetPassword: React.FC<Props> = props => {
-  const [password, setPassword] = React.useState("");
-  const [verifyPassword, setVerifyPassword] = React.useState("");
-  const [user, setUser] = React.useState<UserInterface>(null);
-  const [showPassword, setShowPassword] = useState(false);
-  const [linkExpired, setLinkExpired] = React.useState(false);
-
-  const validate = () => {
-    const result = [];
-    if (!password) result.push(Locale.label("login.validate.password"));
-    else if (password.length < 8) result.push(Locale.label("login.validate.passwordLength"));
-    else if (password !== verifyPassword) result.push(Locale.label("login.validate.passwordMatch"));
-    props.setErrors(result);
-    return result.length === 0;
-  }
-
-  const submitChangePassword = () => {
-    if (linkExpired) {
-      window.open("/login", "_blank");
-    } else if (validate()) {
-      submit();
-    }
-  }
-
-  const loadUser = () => {
-    ApiHelper.postAnonymous("/users/login", { authGuid: props.auth }, "MembershipApi").then((resp: LoginResponseInterface) => {
-
-      console.log("RESPONSE", resp);
-      if (resp.user) setUser(resp.user);
-      else props.setShowForgot(true);
-    }).catch(() => {
-      props.setShowForgot(true);
-    });
-  }
-
-  const submit = async () => {
-    const resp = await ApiHelper.postAnonymous("/users/setPasswordGuid", { authGuid: props.auth, newPassword: password, appName: props.appName, appUrl: props.appUrl }, "MembershipApi");
-    if (resp.success) props.login({ email: user.email, password });
-    else props.setShowForgot(true);
-  }
-
-  React.useEffect(() => {
-    //Get the timestamp from the URL
-    const urlParams = new URLSearchParams(window.location.search);
-    const timestampParam = urlParams.get("timestamp");
-    if (timestampParam) {
-      const linkTimestamp = parseInt(timestampParam, 10);
-      const currentTime = Date.now();
-
-      //Check if the link is expired (2 min)
-      if (currentTime - linkTimestamp > 600000) {
-        setLinkExpired(true);
-      } else {
-        loadUser();
-      }
-    } else {
-      setLinkExpired(true); //No timestamp means link is invalid
-    }
-  }, []);
-
-  return (
-    <InputBox headerText={Locale.label("login.setPassword")} saveFunction={submitChangePassword} saveButtonType="submit" saveText={!linkExpired ? (props.isSubmitting || !user) ? Locale.label("common.pleaseWait") : Locale.label("login.signIn") : Locale.label("login.requestLink")} isSubmitting={props.isSubmitting}>
-      {linkExpired ? (
-        <>
-          <Typography sx={{ color: "#c62828 !important", paddingBottom: 3 }}>{Locale.label("login.expiredLink")}</Typography>
-        </>
-        ) : (
-        <>
-          {user && <p style={{ marginTop: 0, marginBottom: 0 }}>{Locale.label("login.welcomeBack")} {user.firstName}.</p>}
-          <TextField fullWidth name="password" type={showPassword ? "text" : "password"} label={Locale.label("login.setPassword")} value={password} onChange={(e) => { e.preventDefault(); setPassword(e.target.value) }}  InputProps={{
-            endAdornment: (<InputAdornment position="end"><IconButton aria-label="toggle password visibility" onClick={() => { setShowPassword(!showPassword) }}>{showPassword ? <Icon>visibility</Icon> : <Icon>visibility_off</Icon>}</IconButton></InputAdornment>)
-          }} />
-          <TextField fullWidth name="verifyPassword" type={showPassword ? "text" : "password"} label={Locale.label("login.verifyPassword")} value={verifyPassword} onChange={(e) => { e.preventDefault(); setVerifyPassword(e.target.value) }}  InputProps={{
-            endAdornment: (<InputAdornment position="end"><IconButton aria-label="toggle password visibility" onClick={() => { setShowPassword(!showPassword) }}>{showPassword ? <Icon>visibility</Icon> : <Icon>visibility_off</Icon>}</IconButton></InputAdornment>)
-          }} />
-        </>
-      )}
-    </InputBox>
-  );
-}

package/src/pageComponents/components/Register.tsx

@@ -1,103 +0,0 @@
-"use client";
-
-import React, { FormEventHandler } from "react";
-import { LoginResponseInterface, RegisterUserInterface, UserInterface } from "@churchapps/helpers";
-import { AnalyticsHelper, ApiHelper, Locale } from "../../helpers";
-import { ErrorMessages } from "../../components";
-import { Button, Stack, TextField, Link } from "@mui/material";
-
-interface Props {
-  appName?: string,
-  appUrl?: string,
-  updateErrors: (errors: string[]) => void,
-  loginCallback?: () => void
-  userRegisteredCallback?: (user: UserInterface) => Promise<void>;
-}
-
-export const Register: React.FC<Props> = (props) => {
-
-  const cleanAppUrl = () => {
-    if (!props.appUrl) return null;
-    else {
-      const index = props.appUrl.indexOf("/", 9);
-      if (index === -1) return props.appUrl;
-      else return props.appUrl.substring(0, index);
-    }
-  }
-
-  const [registered, setRegistered] = React.useState(false);
-  const [user, setUser] = React.useState<RegisterUserInterface>({ firstName: "", lastName: "", email: "", appName: props.appName, appUrl: cleanAppUrl() });
-  const [errors, setErrors] = React.useState([]);
-  const [isSubmitting, setIsSubmitting] = React.useState(false);
-
-  const handleRegisterErrors = (errors: string[]) => {
-    props.updateErrors(errors)
-  }
-
-  const handleRegisterSuccess = (resp: LoginResponseInterface) => {
-    setRegistered(true);
-    AnalyticsHelper.logEvent("User", "Register");
-    if (props.userRegisteredCallback) props.userRegisteredCallback(resp.user);
-  }
-
-  const validateEmail = (email: string) => (/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(.\w{2,3})+$/.test(email))
-
-  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const u = { ...user }
-    switch (e.target.name) {
-      case "firstName": u.firstName = e.target.value; break;
-      case "lastName": u.lastName = e.target.value; break;
-      case "email": u.email = e.target.value; break;
-    }
-    setUser(u);
-  }
-
-  const validate = () => {
-    let errors = [];
-    if (!user.email?.trim()) errors.push(Locale.label("login.validate.email"));
-    else if (!validateEmail(user.email)) errors.push(Locale.label("login.validate.email"));
-    if (!user.firstName?.trim()) errors.push(Locale.label("login.validate.firstName"));
-    if (!user.lastName?.trim()) errors.push(Locale.label("login.validate.lastName"));
-    setErrors(errors);
-    return errors.length === 0;
-  }
-
-  const register: FormEventHandler = (e) => {
-    e.preventDefault();
-    props.updateErrors([])
-    if (validate()) {
-      setIsSubmitting(true);
-      ApiHelper.postAnonymous("/users/register", user, "MembershipApi")
-        .then((resp: any) => {
-          if (resp.errors) handleRegisterErrors(resp.errors);
-          else handleRegisterSuccess(resp);
-        })
-        .catch((e) => { props.updateErrors([e.toString()]); throw e; })
-        .finally(() => {
-          setIsSubmitting(false)
-        });
-    } else {
-      e.preventDefault();
-    }
-  };
-
-  const getForm = () => (<>
-    <ErrorMessages errors={errors} />
-    <form onSubmit={register}>
-      <TextField fullWidth name="firstName" label="First Name" value={user.firstName} onChange={handleChange} />
-      <TextField fullWidth name="lastName" label="Last Name" value={user.lastName} onChange={handleChange} />
-      <TextField fullWidth type="email" name="email" label="Email" value={user.email} onChange={handleChange} />
-      <br />
-      <Stack direction="row" sx={{ marginTop: 1 }} spacing={1} justifyContent="end">
-        {props.loginCallback && (<Button variant="text" onClick={(e) => { e.preventDefault(); props.loginCallback(); }}>{Locale.label("login.login")}</Button>)}
-        <Button id="signInButton" variant="contained" disableElevation type="submit" disabled={isSubmitting} color="primary" onClick={register} sx={{ "&:focus": { outline: "none" } }}>
-          {isSubmitting ? "Please wait..." : "Register"}
-        </Button>
-      </Stack>
-    </form>
-  </>)
-
-  if (registered) return (<p>{Locale.label("login.registerThankYou")}</p>);
-  else return getForm();
-
-};

package/src/pageComponents/components/SelectChurchModal.tsx

@@ -1,58 +0,0 @@
-"use client";
-
-import React from "react";
-import { ChurchInterface, LoginUserChurchInterface } from "@churchapps/helpers";
-import { SelectChurchSearch } from "./SelectChurchSearch";
-import { SelectableChurch } from "./SelectableChurch";
-import { ErrorMessages } from "../../components"
-import { Dialog, DialogContent, DialogTitle, Icon, IconButton, Tooltip } from "@mui/material";
-import { Locale } from "../../helpers";
-
-interface Props {
-	appName: string,
-	show: boolean,
-	userChurches?: LoginUserChurchInterface[],
-	selectChurch: (churchId: string) => void,
-	registeredChurchCallback?: (church: ChurchInterface) => void,
-	errors?: string[],
-	handleRedirect?: (url: string) => void
-}
-
-export const SelectChurchModal: React.FC<Props> = (props) => {
-	const [showSearch, setShowSearch] = React.useState(false);
-
-	const handleClose = () => {
-		window.location.reload();
-	}
-
-	const getContents = () => {
-		if (showSearch || props.userChurches?.length === 0) return <SelectChurchSearch selectChurch={props.selectChurch} registeredChurchCallback={props.registeredChurchCallback} appName={props.appName} />
-		else return (<>
-			{props.userChurches?.map(uc => (<SelectableChurch church={uc.church} selectChurch={props.selectChurch} key={uc.church.id} />))}
-			<a href="about:blank" style={{ display: "block", textAlign: "center" }} onClick={(e) => { e.preventDefault(); setShowSearch(true); }}>{Locale.label("selectChurch.another")}</a>
-		</>);
-	}
-
-	return (
-		<Dialog open={props.show} onClose={handleClose}>
-			<DialogTitle>{Locale.label("selectChurch.selectChurch")}
-			</DialogTitle>
-			<Tooltip title="Logout" arrow>
-				<IconButton sx={{ position: "absolute", right: 8, top: 8 }} color="error" onClick={() => {
-					// Use handleRedirect function if available, otherwise fallback to window.location
-					if (props.handleRedirect) {
-						props.handleRedirect("/logout");
-					} else {
-						window.location.href = "/logout";
-					}
-				}}>
-					<Icon>logout</Icon>
-				</IconButton>
-			</Tooltip>
-			<DialogContent sx={{ width: 500, maxWidth: "100%" }}>
-				<ErrorMessages errors={props.errors} />
-				{getContents()}
-			</DialogContent>
-		</Dialog>
-	);
-};

package/src/pageComponents/components/SelectChurchRegister.tsx

@@ -1,87 +0,0 @@
-"use client";
-
-import React from "react";
-import { ApiHelper, Locale } from "../../helpers"
-import { ChurchInterface, RegisterChurchRequestInterface } from "@churchapps/helpers";
-import { ErrorMessages, InputBox } from "../../components"
-import { Grid, TextField } from "@mui/material";
-
-interface Props {
-  initialChurchName: string,
-  registeredChurchCallback?: (church: ChurchInterface) => void,
-  selectChurch: (churchId: string) => void,
-  appName: string
-}
-
-export const SelectChurchRegister: React.FC<Props> = (props) => {
-  const suggestSubDomain = (name: string) => {
-    let result = name.toLowerCase().replaceAll("christian", "").replaceAll("church", "").replaceAll(" ", "");
-    return result;
-  }
-
-  const [church, setChurch] = React.useState<RegisterChurchRequestInterface>({ name: props.initialChurchName, appName: props.appName, subDomain: suggestSubDomain(props.initialChurchName) });
-  const [errors, setErrors] = React.useState([]);
-  const [isSubmitting, setIsSubmitting] = React.useState(false);
-
-  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const c = { ...church }
-    switch (e.target.name) {
-      case "churchName": c.name = e.target.value; break;
-      case "subDomain": c.subDomain = e.target.value; break;
-      case "address1": c.address1 = e.target.value; break;
-      case "address2": c.address2 = e.target.value; break;
-      case "city": c.city = e.target.value; break;
-      case "state": c.state = e.target.value; break;
-      case "zip": c.zip = e.target.value; break;
-      case "country": c.country = e.target.value; break;
-    }
-    setChurch(c);
-  }
-
-  const validate = () => {
-    let errors = [];
-    if (!church.name?.trim()) errors.push(Locale.label("selectChurch.validate.name"));
-    if (!church.address1?.trim()) errors.push(Locale.label("selectChurch.validate.address"));
-    if (!church.city?.trim()) errors.push(Locale.label("selectChurch.validate.city"));
-    if (!church.state?.trim()) errors.push(Locale.label("selectChurch.validate.state"));
-    if (!church.zip?.trim()) errors.push(Locale.label("selectChurch.validate.zip"));
-    if (!church.country?.trim()) errors.push(Locale.label("selectChurch.validate.country"));
-    setErrors(errors);
-    return errors.length === 0;
-  }
-
-  const handleSave = () => {
-    if (validate()) {
-      setIsSubmitting(true);
-      const c = { ...church };
-      if (!c.subDomain) c.subDomain = suggestSubDomain(c.name);
-      ApiHelper.post("/churches/add", church, "MembershipApi").then(async resp => {
-        setIsSubmitting(false);
-        if (resp.errors !== undefined) setErrors(errors);
-        else {
-          if (props.registeredChurchCallback) props.registeredChurchCallback(resp);
-          props.selectChurch(resp.id);
-        }
-      });
-    }
-  }
-
-  return (
-    <InputBox id="churchBox" saveFunction={handleSave} headerText={Locale.label("selectChurch.register")} headerIcon="church" isSubmitting={isSubmitting}>
-      <ErrorMessages errors={errors} />
-      <TextField required fullWidth name="churchName" label={Locale.label("selectChurch.name")} value={church.name} onChange={handleChange} />
-
-      <TextField required fullWidth name="address1" label={Locale.label("selectChurch.address1")} value={church.address1} onChange={handleChange} />
-      <Grid container spacing={3}>
-        <Grid size={6}><TextField fullWidth name="address2" label={Locale.label("selectChurch.address2")} value={church.address2} onChange={handleChange} /></Grid>
-        <Grid size={6}><TextField required fullWidth name="city" label={Locale.label("selectChurch.city")} value={church.city} onChange={handleChange} /></Grid>
-      </Grid>
-      <Grid container spacing={3}>
-        <Grid size={6}><TextField required fullWidth name="state" label={Locale.label("selectChurch.state")} value={church.state} onChange={handleChange} /></Grid>
-        <Grid size={6}><TextField required fullWidth name="zip" label={Locale.label("selectChurch.zip")} value={church.zip} onChange={handleChange} /></Grid>
-      </Grid>
-      <TextField required fullWidth name="country" label={Locale.label("selectChurch.country")} value={church.country} onChange={handleChange} />
-    </InputBox>
-  );
-};
-

package/src/pageComponents/components/SelectChurchSearch.tsx

@@ -1,71 +0,0 @@
-"use client";
-
-import { Button, TextField } from "@mui/material";
-import React from "react";
-import { ApiHelper, Locale } from "../../helpers"
-import { ChurchInterface } from "@churchapps/helpers";
-import { SelectableChurch } from "./SelectableChurch";
-import { SelectChurchRegister } from "./SelectChurchRegister";
-
-interface Props {
-	selectChurch: (churchId: string) => void,
-	registeredChurchCallback?: (church: ChurchInterface) => void,
-	appName: string
-}
-
-export const SelectChurchSearch: React.FC<Props> = (props) => {
-	const [searchText, setSearchText] = React.useState("");
-	const [churches, setChurches] = React.useState<ChurchInterface[]>(null);
-	const [showRegister, setShowRegister] = React.useState(false);
-
-	const handleSubmit = (e: React.MouseEvent) => {
-		if (e !== null) e.preventDefault();
-		let term = searchText.trim();
-		ApiHelper.post("/churches/search", { name: term }, "MembershipApi").then(data => setChurches(data));
-	}
-
-	const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => setSearchText(e.currentTarget.value);
-
-	const handleKeyDown = (e: React.KeyboardEvent<any>) => { if (e.key === "Enter") { e.preventDefault(); handleSubmit(null); } }
-
-	const handleRegisterClick = (e: React.MouseEvent) => {
-		e.preventDefault();
-		if (window.confirm(Locale.label("selectChurch.confirmRegister"))) {
-			setShowRegister(true);
-		}
-	}
-
-	const getRegisterLink = () => (
-		<div>
-			<a style={{ display: "block", textAlign: "center" }} href="about:blank" onClick={handleRegisterClick}>
-				{Locale.label("selectChurch.register")}
-			</a>
-		</div>
-	)
-
-	const getChurches = () => {
-		const result: React.ReactElement[] = [];
-		churches.forEach(church => {
-			result.push(<SelectableChurch church={church} selectChurch={props.selectChurch} />);
-		});
-		result.push(getRegisterLink());
-		return result;
-	}
-
-	const getResults = () => {
-		if (churches === null) return;
-		else if (churches.length === 0) return <><p>{Locale.label("selectChurch.noMatches")}</p>{getRegisterLink()}</>
-		else return getChurches();
-	}
-
-	if (showRegister) return (<SelectChurchRegister selectChurch={props.selectChurch} registeredChurchCallback={props.registeredChurchCallback} appName={props.appName} initialChurchName={searchText} />)
-	else return (
-		<>
-			<TextField fullWidth name="searchText" label="Name" value={searchText} onChange={handleChange} onKeyDown={handleKeyDown}
-				InputProps={{ endAdornment: <Button variant="contained" id="searchButton" data-testid="search-button" onClick={handleSubmit}>{Locale.label("common.search")}</Button> }}
-			/>
-			{getResults()}
-		</>
-
-	);
-};

package/src/pageComponents/components/SelectableChurch.tsx

@@ -1,40 +0,0 @@
-"use client";
-
-import { Grid } from "@mui/material";
-import React from "react";
-import { ArrayHelper } from "../../helpers"
-import { ChurchInterface, GenericSettingInterface } from "@churchapps/helpers";
-
-interface Props {
-  selectChurch: (churchId: string) => void,
-  church: ChurchInterface
-}
-
-export const SelectableChurch: React.FC<Props> = (props) => {
-
-  let logo = "/images/logo.png";
-  if (props.church.settings) {
-    let l: GenericSettingInterface = ArrayHelper.getOne(props.church.settings, "keyName", "logoLight");
-    if (l?.value) logo = l.value;
-  }
-  return (
-    <Grid container spacing={3}>
-      <Grid size={{ xs: 12, md: 6 }}>
-        <a href="about:blank" style={{ fontSize: "1.125rem", display: "block", marginTop: 15, marginBottom: 15 }} onClick={(e) => { e.preventDefault(); props.selectChurch(props.church.id) }}>
-          <img src={logo} alt="church logo" className="w-100 img-fluid" />
-        </a>
-      </Grid>
-      <Grid size={{ xs: 12, md: 6 }}>
-        <div>
-          <a href="about:blank" style={{ fontSize: "1.125rem", display: "block" }} onClick={(e) => { e.preventDefault(); props.selectChurch(props.church.id) }}>{props.church.name}</a>
-          {(props.church.address1) && <div>{props.church.address1}</div>}
-          {(props.church.city || props.church.state) && <div>
-            {props.church.city && props.church.city + ", "}
-            {props.church.state}
-          </div>}
-        </div>
-      </Grid>
-      <span style={{ display: "block", width: "100%", borderTop: "1px solid #ccc", margin: "1rem" }}></span>
-    </Grid>
-  );
-};

package/src/pageComponents/index.ts

@@ -1,3 +0,0 @@
-export { LoginPage } from "./LoginPage";
-export { LogoutPage } from "./LogoutPage";
-export { Register } from "./components/Register";