fln-espranza 0.0.41 → 0.0.42

package/.expo/README.md

@@ -1,15 +1,15 @@
-> Why do I have a folder named ".expo" in my project?
-
-The ".expo" folder is created when an Expo project is started using "expo start" command.
-
-> What do the files contain?
-
-- "devices.json": contains information about devices that have recently opened this project. This is used to populate the "Development sessions" list in your development builds.
-- "packager-info.json": contains port numbers and process PIDs that are used to serve the application to the mobile device/simulator.
-- "settings.json": contains the server configuration that is used to serve the application manifest.
-
-> Should I commit the ".expo" folder?
-
-No, you should not share the ".expo" folder. It does not contain any information that is relevant for other developers working on the project, it is specific to your machine.
-
-Upon project creation, the ".expo" folder is already added to your ".gitignore" file.
+> Why do I have a folder named ".expo" in my project?
+
+The ".expo" folder is created when an Expo project is started using "expo start" command.
+
+> What do the files contain?
+
+- "devices.json": contains information about devices that have recently opened this project. This is used to populate the "Development sessions" list in your development builds.
+- "packager-info.json": contains port numbers and process PIDs that are used to serve the application to the mobile device/simulator.
+- "settings.json": contains the server configuration that is used to serve the application manifest.
+
+> Should I commit the ".expo" folder?
+
+No, you should not share the ".expo" folder. It does not contain any information that is relevant for other developers working on the project, it is specific to your machine.
+
+Upon project creation, the ".expo" folder is already added to your ".gitignore" file.

package/.expo/settings.json

@@ -1,8 +1,8 @@
-{
-  "hostType": "lan",
-  "lanType": "ip",
-  "dev": true,
-  "minify": false,
-  "urlRandomness": null,
-  "https": false
-}
+{
+  "hostType": "lan",
+  "lanType": "ip",
+  "dev": true,
+  "minify": false,
+  "urlRandomness": null,
+  "https": false
+}

package/components/Avatar.tsx

@@ -1,43 +1,43 @@
-import { View, Image, ImageProps } from "react-native";
-import React from "react";
-import tw from "../lib/tailwind";
-import EText from "./EText";
-
-interface AvatarProps {
-  size?: "xxs" | "xs" | "sm" | "lg" | "5xl";
-  source: string;
-  nameFirstLetter?: string;
-  textColor?: string;
-}
-
-export default function Avatar({ size, source, nameFirstLetter, textColor }: AvatarProps) {
-    let colors = [
-     "#00BE9B",
-     "#0993BF",
-     "#64748B",
-     "#3F3D84",
-     "#0993BF",
-     "#525252",
-     "#EA580C",
-     "#2D3A5D",
-    ]
-
-    // let color = colors[Math.floor(Math.random() * colors.length)]
-    const [color, setColor] = React.useState(colors[Math.floor(Math.random() * colors.length)]);
-  return (
-    <View
-      style={tw.style(
-        "flex items-center justify-center w-16 h-16 rounded-full overflow-hidden",
-        size === "lg" && "w-16 h-16",
-        size === "sm" && "w-12 h-12",
-        size === "xs" && "w-10 h-10",
-        size === "xxs" && "w-7 h-7",
-        size === "5xl" && "w-20 h-20",
-        `bg-[${color}]`
-      )}
-    >
-      {source ? <Image style={tw`w-full h-full `} source={source} /> : 
-      <EText style={tw`text-xl font-bold text-white uppercase`}>{nameFirstLetter}</EText>}
-    </View>
-  );
-}
+import { View, Image, ImageProps } from "react-native";
+import React from "react";
+import tw from "../lib/tailwind";
+import EText from "./EText";
+
+interface AvatarProps {
+  size?: "xxs" | "xs" | "sm" | "lg" | "5xl";
+  source: string;
+  nameFirstLetter?: string;
+  textColor?: string;
+}
+
+export default function Avatar({ size, source, nameFirstLetter, textColor }: AvatarProps) {
+    let colors = [
+     "#00BE9B",
+     "#0993BF",
+     "#64748B",
+     "#3F3D84",
+     "#0993BF",
+     "#525252",
+     "#EA580C",
+     "#2D3A5D",
+    ]
+
+    // let color = colors[Math.floor(Math.random() * colors.length)]
+    const [color, setColor] = React.useState(colors[Math.floor(Math.random() * colors.length)]);
+  return (
+    <View
+      style={tw.style(
+        "flex items-center justify-center w-16 h-16 rounded-full overflow-hidden",
+        size === "lg" && "w-16 h-16",
+        size === "sm" && "w-12 h-12",
+        size === "xs" && "w-10 h-10",
+        size === "xxs" && "w-7 h-7",
+        size === "5xl" && "w-20 h-20",
+        `bg-[${color}]`
+      )}
+    >
+      {source ? <Image style={tw`w-full h-full `} source={source} /> : 
+      <EText style={tw`text-xl font-bold text-white uppercase`}>{nameFirstLetter}</EText>}
+    </View>
+  );
+}

package/components/BaseLayout.tsx

@@ -1,174 +1,174 @@
-import { View, ImageBackground, Dimensions, Animated } from "react-native";
-import React, { useEffect, useRef, useState } from "react";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import tw from "../lib/tailwind";
-import EText from "./EText";
-import { StatusBar } from "expo-status-bar";
-import { Container, EButton, EButtonIcon, PageHeader } from ".";
-import Constants from "expo-constants";
-import { useNavigation } from "@react-navigation/native";
-
-const SCREEN_WIDTH = Dimensions.get("window").width;
-const SCREEN_HEIGHT = Dimensions.get("window").height;
-const HEADER_HEIGHT = Constants.statusBarHeight + 60;
-const SCROLL_PADDING_BOTTOM = 100;
-
-interface BaseLayoutProps {
-  title: string;
-  subtitle?: string;
-  curved?: boolean;
-  headerContent?: JSX.Element;
-  children?: JSX.Element;
-  iconEnd?: JSX.Element;
-  noScroll?: boolean;
-  bottomButton?: JSX.Element;
-  border?: boolean;
-  menuButton?: boolean;
-}
-
-export default function BaseLayout({
-  title,
-  subtitle,
-  curved,
-  headerContent,
-  children,
-  noScroll,
-  iconEnd,
-  bottomButton,
-  border,
-  menuButton,
-}: BaseLayoutProps) {
-  const insets = useSafeAreaInsets();
-  const [headerScrolled, setHeaderScrolled] = useState(false);
-  const scrollY = useRef(new Animated.Value(0)).current;
-  const opacity = useRef(new Animated.Value(0)).current;
-
-  useEffect(() => {
-    Animated.spring(scrollY, {
-      toValue: headerScrolled ? 0 : -40,
-      speed: 2,
-      delay: 1,
-      bounciness: 1,
-      useNativeDriver: true,
-    }).start();
-
-    Animated.spring(opacity, {
-      toValue: headerScrolled ? 0.975 : 0,
-      speed: 2,
-      delay: 1,
-      bounciness: 1,
-      useNativeDriver: true,
-    }).start();
-  }, [headerScrolled]);
-
-  const navigation = useNavigation();
-
-  return (
-    <View
-      style={[
-        tw`flex-1 bg-white`,
-        {
-          paddingBottom: noScroll ? 0 : insets.bottom,
-        },
-      ]}
-    >
-      <StatusBar
-        style={headerScrolled ? "light" : curved ? "light" : "dark"}
-        animated
-      />
-      {/* COLLAPSED HEADER */}
-      <Animated.View
-        style={[
-          tw`absolute top-0 left-0 right-0 bg-white z-10 shadow-2xl`,
-          {
-            transform: [{ translateY: scrollY }],
-            opacity,
-          },
-        ]}
-      >
-        <ImageBackground
-          style={[tw`flex-1`, {}]}
-          source={require("../assets/images/bg-header.jpg")}
-        >
-          <View
-            style={[
-              tw`flex-1 pl-3 pb-3 flex-row items-center`,
-              { paddingTop: Constants.statusBarHeight + 4 },
-            ]}
-          >
-            <EButtonIcon
-              iconColor={"white"}
-              size={20}
-              onPress={() => navigation.goBack()}
-            />
-            <View style={tw`ml-2`}>
-              <EText size="base" style={tw`font-semibold text-white mb-0.5`}>
-                {title}
-              </EText>
-              {subtitle ? (
-                <EText
-                  size="xs"
-                  style={tw`font-semibold text-white opacity-40`}
-                >
-                  {subtitle}
-                </EText>
-              ) : null}
-            </View>
-          </View>
-        </ImageBackground>
-      </Animated.View>
-
-      {noScroll ? (
-        <View style={tw`flex-1`}>
-          <PageHeader
-            title={title}
-            subtitle={subtitle}
-            curved={curved}
-            iconEnd={iconEnd}
-          >
-            {headerContent}
-          </PageHeader>
-          {children}
-        </View>
-      ) : (
-        <Animated.ScrollView
-          onScroll={(event) => {
-            const scrolling = event.nativeEvent.contentOffset.y;
-            scrolling > 60 ? setHeaderScrolled(true) : setHeaderScrolled(false);
-          }}
-          style={[
-            tw`flex-1`,
-            { minHeight: SCREEN_HEIGHT, paddingBottom: SCROLL_PADDING_BOTTOM },
-          ]}
-          scrollEventThrottle={16}
-          showsVerticalScrollIndicator={false}
-          decelerationRate={"fast"}
-          //   fadingEdgeLength={1s00}
-          // alwaysBounceVertical={false}
-          contentContainerStyle={{
-            paddingBottom: SCROLL_PADDING_BOTTOM,
-          }}
-        >
-          <PageHeader
-            menuButton={menuButton}
-            title={title}
-            subtitle={subtitle}
-            curved={curved}
-            iconEnd={iconEnd}
-            border={border}
-          >
-            {headerContent}
-          </PageHeader>
-          {children}
-        </Animated.ScrollView>
-      )}
-      {bottomButton ? (
-        <Container style={tw`flex-1 justify-end mb-4 `}>
-          {bottomButton}
-        </Container>
-      ) : (
-        <></>
-      )}
-    </View>
-  );
-}
+import { View, ImageBackground, Dimensions, Animated } from "react-native";
+import React, { useEffect, useRef, useState } from "react";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
+import tw from "../lib/tailwind";
+import EText from "./EText";
+import { StatusBar } from "expo-status-bar";
+import { Container, EButton, EButtonIcon, PageHeader } from ".";
+import Constants from "expo-constants";
+import { useNavigation } from "@react-navigation/native";
+
+const SCREEN_WIDTH = Dimensions.get("window").width;
+const SCREEN_HEIGHT = Dimensions.get("window").height;
+const HEADER_HEIGHT = Constants.statusBarHeight + 60;
+const SCROLL_PADDING_BOTTOM = 100;
+
+interface BaseLayoutProps {
+  title: string;
+  subtitle?: string;
+  curved?: boolean;
+  headerContent?: JSX.Element;
+  children?: JSX.Element;
+  iconEnd?: JSX.Element;
+  noScroll?: boolean;
+  bottomButton?: JSX.Element;
+  border?: boolean;
+  menuButton?: boolean;
+}
+
+export default function BaseLayout({
+  title,
+  subtitle,
+  curved,
+  headerContent,
+  children,
+  noScroll,
+  iconEnd,
+  bottomButton,
+  border,
+  menuButton,
+}: BaseLayoutProps) {
+  const insets = useSafeAreaInsets();
+  const [headerScrolled, setHeaderScrolled] = useState(false);
+  const scrollY = useRef(new Animated.Value(0)).current;
+  const opacity = useRef(new Animated.Value(0)).current;
+
+  useEffect(() => {
+    Animated.spring(scrollY, {
+      toValue: headerScrolled ? 0 : -40,
+      speed: 2,
+      delay: 1,
+      bounciness: 1,
+      useNativeDriver: true,
+    }).start();
+
+    Animated.spring(opacity, {
+      toValue: headerScrolled ? 0.975 : 0,
+      speed: 2,
+      delay: 1,
+      bounciness: 1,
+      useNativeDriver: true,
+    }).start();
+  }, [headerScrolled]);
+
+  const navigation = useNavigation();
+
+  return (
+    <View
+      style={[
+        tw`flex-1 bg-white`,
+        {
+          paddingBottom: noScroll ? 0 : insets.bottom,
+        },
+      ]}
+    >
+      <StatusBar
+        style={headerScrolled ? "light" : curved ? "light" : "dark"}
+        animated
+      />
+      {/* COLLAPSED HEADER */}
+      <Animated.View
+        style={[
+          tw`absolute top-0 left-0 right-0 bg-white z-10 shadow-2xl`,
+          {
+            transform: [{ translateY: scrollY }],
+            opacity,
+          },
+        ]}
+      >
+        <ImageBackground
+          style={[tw`flex-1`, {}]}
+          source={require("../assets/images/bg-header.jpg")}
+        >
+          <View
+            style={[
+              tw`flex-1 pl-3 pb-3 flex-row items-center`,
+              { paddingTop: Constants.statusBarHeight + 4 },
+            ]}
+          >
+            <EButtonIcon
+              iconColor={"white"}
+              size={20}
+              onPress={() => navigation.goBack()}
+            />
+            <View style={tw`ml-2`}>
+              <EText size="base" style={tw`font-semibold text-white mb-0.5`}>
+                {title}
+              </EText>
+              {subtitle ? (
+                <EText
+                  size="xs"
+                  style={tw`font-semibold text-white opacity-40`}
+                >
+                  {subtitle}
+                </EText>
+              ) : null}
+            </View>
+          </View>
+        </ImageBackground>
+      </Animated.View>
+
+      {noScroll ? (
+        <View style={tw`flex-1`}>
+          <PageHeader
+            title={title}
+            subtitle={subtitle}
+            curved={curved}
+            iconEnd={iconEnd}
+          >
+            {headerContent}
+          </PageHeader>
+          {children}
+        </View>
+      ) : (
+        <Animated.ScrollView
+          onScroll={(event) => {
+            const scrolling = event.nativeEvent.contentOffset.y;
+            scrolling > 60 ? setHeaderScrolled(true) : setHeaderScrolled(false);
+          }}
+          style={[
+            tw`flex-1`,
+            { minHeight: SCREEN_HEIGHT, paddingBottom: SCROLL_PADDING_BOTTOM },
+          ]}
+          scrollEventThrottle={16}
+          showsVerticalScrollIndicator={false}
+          decelerationRate={"fast"}
+          //   fadingEdgeLength={1s00}
+          // alwaysBounceVertical={false}
+          contentContainerStyle={{
+            paddingBottom: SCROLL_PADDING_BOTTOM,
+          }}
+        >
+          <PageHeader
+            menuButton={menuButton}
+            title={title}
+            subtitle={subtitle}
+            curved={curved}
+            iconEnd={iconEnd}
+            border={border}
+          >
+            {headerContent}
+          </PageHeader>
+          {children}
+        </Animated.ScrollView>
+      )}
+      {bottomButton ? (
+        <Container style={tw`flex-1 justify-end mb-4 `}>
+          {bottomButton}
+        </Container>
+      ) : (
+        <></>
+      )}
+    </View>
+  );
+}