react-native-exp-fig 0.1.44 → 2.0.0

package/src/components/modal-journey-rectification/index.tsx

@@ -1,213 +0,0 @@
-/**
- * IMPORTS
- */
-import React, { useMemo, useState, useCallback } from "react";
-import { Modal, View, Pressable } from "react-native";
-
-// components
-import Box from "../box";
-import { Button } from "../button";
-
-import { Typography } from "../typography";
-
-import ActivityFields from "../selects/select-date-and-hours";
-
-import SelectOption from "../selects/select-option";
-
-// commons
-import { Icons } from "../../common/icons-svg";
-import { asBaseComponent } from "../../@types/as-base-component";
-
-// helpers
-import { retificacaoActivities } from "../modals/modal-activities/data-activities";
-
-// typings
-import type { IDateAndHoursProps, IModalJourneyRectificationProps } from "./interface";
-
-// styles / theme
-import { theme } from "../../styles/theme/theme";
-import { styles } from "./styles";
-import { formatDate, formHoursMinute } from "../../utils/format-data";
-
-const ModalJourneyRectification: React.FC<IModalJourneyRectificationProps<any>> = React.memo(
-  ({ visible, onClose, onPressConfirm, textTitle }) => {
-    const [dateAndHours, setDateAndHours] = useState<IDateAndHoursProps>({
-      date: formatDate(new Date()),
-      hours: formHoursMinute(String(new Date().getHours() * 3600 + new Date().getMinutes() * 60)),
-    });
-
-    // estados controlados mínimos
-    const [selectedActivitie, setSelectedActivitie] = useState<number | null>(
-      retificacaoActivities[0]?.value ?? null
-    );
-
-    // label do motivo derivada com memo
-    const activitieLabel = useMemo(
-      () =>
-        retificacaoActivities?.find((activitie) => activitie.value === selectedActivitie)?.label ??
-        null,
-      [selectedActivitie]
-    );
-
-    // handlers estáveis
-    const handleChangeReason = useCallback((value: number | null) => {
-      setSelectedActivitie(value);
-    }, []);
-
-    const handleCancel = useCallback(() => {
-      onClose?.();
-    }, [onClose]);
-
-    const handleConfirm = useCallback(() => {
-      onPressConfirm?.({
-        value: selectedActivitie,
-        label: activitieLabel,
-        dateAndHours: dateAndHours,
-      });
-
-      onClose?.();
-    }, [onPressConfirm, onClose, activitieLabel, selectedActivitie, dateAndHours]);
-
-    return (
-      <Modal
-        animationType="fade"
-        transparent
-        visible={visible}
-        onRequestClose={handleCancel}
-        statusBarTranslucent
-      >
-        <Pressable style={styles.overlay} onPress={handleCancel}>
-          <Box
-            width="90%"
-            backgroundColor={theme.colors.orange[500]}
-            borderStyled={{ borderRadius: theme.borderWidths.thick_medium }}
-            paddingStyle={{
-              paddingLeft: theme.paddings["2xs"],
-              paddingRight: theme.paddings["2xs"],
-              paddingTop: theme.paddings.sm,
-              paddingBottom: theme.paddings.sm,
-            }}
-          >
-            <View style={styles.headerRow}>
-              <Icons
-                icon="EXCLAMATION_TRIANGLE"
-                color={theme.colors.orange[500]}
-                background={theme.colors.neutral[300]}
-                size={22}
-              />
-              <Typography
-                text={textTitle ?? "Editar atividad"}
-                color={theme.colors.neutral[25]}
-                marginLeft={theme.margins["2xs"]}
-                fontFamily={theme.fonts.inter_bold}
-                fontWeight="700"
-                size={theme.fontSizes.lg}
-              />
-            </View>
-
-            <Box
-              backgroundColor={theme.colors.neutral[300]}
-              paddingStyle={{ padding: theme.paddings.xs }}
-              borderStyled={{ borderRadius: theme.borderWidths.thick_medium }}
-            >
-              <Typography
-                text="Confirme as alterações antes de salvar."
-                color={theme.colors.black[100]}
-                fontFamily={theme.fonts.inter_regular_400}
-                fontWeight="400"
-                lineHeight={theme.lineHeight["2xl"]}
-                size={theme.fontSizes.sm}
-                marginBottom={16}
-              />
-
-              <SelectOption
-                titleLabel="Selecione um motivo"
-                sizeTitleLabel={18}
-                dataOption={retificacaoActivities as any}
-                handleSelectDown={handleChangeReason}
-                backgroundColor={theme.colors.neutral[300]}
-              />
-
-              <ActivityFields
-                disabled={false}
-                icon={"CALENDAR"}
-                value={dateAndHours?.date}
-                onPressConfirm={(value) =>
-                  setDateAndHours({ date: value, hours: dateAndHours?.hours })
-                }
-              />
-
-              <ActivityFields
-                disabled={false}
-                icon={"TIMER"}
-                value={dateAndHours?.hours}
-                onPressConfirm={(value) =>
-                  setDateAndHours({ date: dateAndHours?.date, hours: value })
-                }
-              />
-
-              <View style={styles.actions}>
-                <Button
-                  title="CANCELAR"
-                  onPress={handleCancel}
-                  width="48%"
-                  height={40}
-                  isLoading={false}
-                  disabled={false}
-                  backgroundColor={theme.colors.neutral[300]}
-                  buttonTextStyle={{
-                    color: theme.colors.blue[500],
-                    fontFamily: theme.fonts.inter_medium_500,
-                    fontSize: theme.fontSizes.xs,
-                    fontWeight: "500",
-                  }}
-                  flexStyle={{
-                    flexDirection: "row",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    textAlign: "center",
-                  }}
-                  borderStyled={{
-                    borderWidth: theme.borderWidths.thin,
-                    borderColor: theme.colors.blue[100],
-                    borderRadius: theme.borderWidths.thick_medium,
-                  }}
-                />
-
-                <Button
-                  title="CONFIRMAR"
-                  onPress={handleConfirm}
-                  width="48%"
-                  height={40}
-                  isLoading={false}
-                  disabled={false}
-                  backgroundColor={theme.colors.blue[500]}
-                  buttonTextStyle={{
-                    color: theme.colors.neutral[25],
-                    fontFamily: theme.fonts.inter_medium_500,
-                    fontSize: theme.fontSizes.xs,
-                    fontWeight: "500",
-                  }}
-                  flexStyle={{
-                    flexDirection: "row",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    textAlign: "center",
-                  }}
-                  borderStyled={{
-                    borderWidth: theme.borderWidths.thin,
-                    borderColor: theme.colors.blue[100],
-                    borderRadius: theme.borderWidths.thick_medium,
-                  }}
-                />
-              </View>
-            </Box>
-          </Box>
-        </Pressable>
-      </Modal>
-    );
-  }
-);
-
-ModalJourneyRectification.displayName = "ModalJourneyRectification";
-export default asBaseComponent(ModalJourneyRectification);

package/src/components/modal-journey-rectification/interface.d.ts

@@ -1,22 +0,0 @@
-/* eslint-disable no-unused-vars */
-/**
- * IMPORTS
- */
-
-type IModalJourneyRectificationProps<T> = {
-  visible: boolean;
-  textTitle?: string;
-  options?: T;
-  onClose: () => void;
-  onPressConfirm: (value: T) => void;
-};
-
-type IDateAndHoursProps = {
-  date: string;
-  hours: string;
-};
-
-/**
- * EXPORTS
- */
-export type { IModalJourneyRectificationProps, IDateAndHoursProps };

package/src/components/modal-journey-rectification/styles.ts

@@ -1,24 +0,0 @@
-/**
- * IMPORTS
- */
-
-import { StyleSheet } from "react-native";
-import { theme } from "../../styles/theme/theme";
-
-const styles = StyleSheet.create({
-  overlay: {
-    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
-    backgroundColor: theme.shadows.z1,
-  },
-  card: { width: "90%" },
-  headerRow: { marginBottom: 10, marginLeft: 4, flexDirection: "row", alignItems: "center" },
-  content: { padding: theme.paddings.xs },
-  actions: { marginTop: 16, flexDirection: "row", justifyContent: "space-between" },
-});
-
-/**
- * EXPORTS
- */
-export { styles };

package/src/components/modals/modal-activities/data-activities/index.ts

@@ -1,133 +0,0 @@
-/**
- * Tipagem da atividade
- */
-export interface IActivity {
-  id: number;
-  referencia: string;
-  cor_hex: string;
-  descricao: string;
-  tipo: "trabalho" | "descanso";
-}
-
-/**
- * Lista base de atividades padrão (normal)
- */
-const baseActivities: Record<string, IActivity[]> = {
-  trabalho: [
-    {
-      id: 1,
-      referencia: "operacao_veiculo",
-      cor_hex: "#000000",
-      descricao: "Operação com Veículo",
-      tipo: "trabalho",
-    },
-    {
-      id: 2,
-      referencia: "aguardando_carga",
-      cor_hex: "#000000",
-      descricao: "Em Carga",
-      tipo: "trabalho",
-    },
-    {
-      id: 3,
-      referencia: "aguardando_descarga",
-      cor_hex: "#000000",
-      descricao: "Em Descarga",
-      tipo: "trabalho",
-    },
-    {
-      id: 8,
-      referencia: "disposicao_veiculo_parado",
-      cor_hex: "#000000",
-      descricao: "Disposição com Veículo Parado",
-      tipo: "trabalho",
-    },
-  ],
-  descanso: [
-    {
-      id: 5,
-      referencia: "repouso_semanal",
-      cor_hex: "#000000",
-      descricao: "Repouso Semanal",
-      tipo: "descanso",
-    },
-    {
-      id: 6,
-      referencia: "repouso_noturno",
-      cor_hex: "#000000",
-      descricao: "Repouso Noturno",
-      tipo: "descanso",
-    },
-    {
-      id: 7,
-      referencia: "refeicao",
-      cor_hex: "#000000",
-      descricao: "Refeição",
-      tipo: "descanso",
-    },
-    {
-      id: 9,
-      referencia: "descanso",
-      cor_hex: "#000000",
-      descricao: "Descanso",
-      tipo: "descanso",
-    },
-  ],
-};
-
-/**
- * Atividades específicas por tipo de usuário
- */
-export const activitiesByDriverType: Record<string, Record<string, IActivity[]>> = {
-  normal: baseActivities,
-  carregador: {
-    trabalho: [
-      {
-        id: 22,
-        referencia: "em_operacao_carregamento",
-        cor_hex: "#000000",
-        descricao: "Em operação - Carregamento",
-        tipo: "trabalho",
-      },
-      {
-        id: 21,
-        referencia: "tempo_disposicao",
-        cor_hex: "#000000",
-        descricao: "Tempo à Disposição",
-        tipo: "trabalho",
-      },
-    ],
-    descanso: baseActivities.descanso!,
-  },
-};
-
-/**
- * Atividades para retificação
- */
-
-export const retificacaoActivities = [
-  {
-    value: 22,
-    label: "Em operação - Carregamento",
-  },
-  {
-    value: 21,
-    label: "Tempo à Disposição",
-  },
-  {
-    value: 5,
-    label: "Repouso Semanal",
-  },
-  {
-    value: 6,
-    label: "Repouso Noturno",
-  },
-  {
-    value: 7,
-    label: "Refeição",
-  },
-  {
-    value: 9,
-    label: "Descanso",
-  },
-];

package/src/components/modals/modal-activities/helpers/index.ts

@@ -1,25 +0,0 @@
-/**
- * IMPORTS
- */
-import { activitiesByDriverType } from "../data-activities";
-
-/**
- * Função que retorna as atividades por tipo de atividade e tipo de usuário (normal ou carregador)
- * @param driverType
- * @param activityType
- * @returns
- */
-const getActivitiesByType = (driverType: string, activityType: string) => {
-  const driverActivities = activitiesByDriverType[driverType];
-
-  if (!driverActivities) {
-    return activitiesByDriverType["carregador"]![activityType] || [];
-  }
-
-  return driverActivities[activityType] || [];
-};
-
-/**
- * EXPORTS
- */
-export { getActivitiesByType };

package/src/components/modals/modal-activity-reason/index.tsx

@@ -1,163 +0,0 @@
-/**
- * IMPORTS
- */
-import React, { useState } from "react";
-import { Modal, View } from "react-native";
-
-// components
-import Box from "../../box";
-import { Typography } from "../../typography";
-import { Button } from "../../button";
-
-import InputTextCounter from "../../input-text-counter";
-
-// commons / svg
-import { Icons } from "../../../common/icons-svg";
-
-// typings
-import type { IModalActivityReasonProps } from "./interface";
-
-// styles
-import { theme } from "../../../styles/theme/theme";
-
-const ModalActivityReason: React.FC<IModalActivityReasonProps> = ({
-  visible,
-  onClose,
-  modalConfirm,
-  textTitle,
-  testID,
-}) => {
-  const [isLoading] = useState(false);
-  const [description, setDescription] = useState("");
-
-  return (
-    <Modal testID={testID} animationType="fade" transparent visible={visible}>
-      <View
-        style={{
-          flex: 1,
-          justifyContent: "center",
-          alignItems: "center",
-          backgroundColor: "rgba(0,0,0,0.6)",
-        }}
-      >
-        <Box
-          width={"90%"}
-          backgroundColor={theme.colors.orange[500]}
-          borderStyled={{
-            borderRadius: theme.borderWidths.thick_medium,
-          }}
-          paddingStyle={{
-            paddingLeft: theme.paddings["2xs"],
-            paddingRight: theme.paddings["2xs"],
-            paddingTop: theme.paddings.sm,
-            paddingBottom: theme.paddings.sm,
-          }}
-        >
-          <Box
-            marginStyle={{ marginBottom: 10, marginLeft: 4 }}
-            flexStyle={{ flexDirection: "row", alignItems: "center" }}
-          >
-            <Icons
-              icon="EXCLAMATION_TRIANGLE"
-              color={theme.colors.orange[500]}
-              background={theme.colors.neutral[300]}
-              size={22}
-            />
-            <Typography
-              text={`${textTitle ?? "Motivo da exclusão"}`}
-              color={theme.colors.neutral[25]}
-              marginLeft={theme.margins["2xs"]}
-              fontFamily={theme.fonts.inter_bold_700}
-              size={theme.fontSizes.md}
-            />
-          </Box>
-
-          <Box
-            backgroundColor={theme.colors.neutral[300]}
-            paddingStyle={{
-              padding: theme.paddings.xs,
-            }}
-            borderStyled={{
-              borderRadius: theme.borderWidths.thick_medium,
-            }}
-          >
-            <Box width="100%">
-              <InputTextCounter
-                label={`${textTitle || "Motivo da exclusão"}`}
-                placeholderTextColor="#9B9B9B"
-                placeholder="Motivo da exclusão"
-                onChangeText={setDescription}
-              />
-            </Box>
-            <Box
-              marginStyle={{ marginTop: 4 }}
-              flexStyle={{
-                flexDirection: "row",
-                justifyContent: "space-between",
-              }}
-            >
-              <Button
-                title="CANCELAR"
-                onPress={onClose}
-                width={"48%"}
-                height={40}
-                isLoading={isLoading}
-                disabled={isLoading}
-                backgroundColor={theme.colors.neutral[300]}
-                buttonTextStyle={{
-                  color: theme.colors.blue[100],
-                  fontFamily: "Inter-Medium",
-                  fontSize: theme.fontSizes.xs,
-                  fontWeight: "500",
-                }}
-                flexStyle={{
-                  flexDirection: "row",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  textAlign: "center",
-                }}
-                borderStyled={{
-                  borderWidth: theme.borderWidths.thin,
-                  borderColor: theme.colors.blue[100],
-                  borderRadius: theme.borderWidths.thick_medium,
-                }}
-              />
-              <Button
-                title="CONFIRMAR"
-                onPress={() => {
-                  modalConfirm(description);
-                }}
-                width={"48%"}
-                height={40}
-                isLoading={isLoading}
-                disabled={isLoading}
-                backgroundColor={theme.colors.blue[500]}
-                buttonTextStyle={{
-                  color: theme.colors.neutral[25],
-                  fontFamily: "Inter-Medium",
-                  fontSize: theme.fontSizes.xs,
-                  fontWeight: "500",
-                }}
-                flexStyle={{
-                  flexDirection: "row",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  textAlign: "center",
-                }}
-                borderStyled={{
-                  borderWidth: theme.borderWidths.thin,
-                  borderColor: theme.colors.blue[100],
-                  borderRadius: theme.borderWidths.thick_medium,
-                }}
-              />
-            </Box>
-          </Box>
-        </Box>
-      </View>
-    </Modal>
-  );
-};
-
-ModalActivityReason.displayName = "ModalActivityReason";
-
-export default ModalActivityReason;

package/src/components/modals/modal-activity-reason/interface.d.ts

@@ -1,10 +0,0 @@
-/* eslint-disable no-unused-vars */
-interface IModalActivityReasonProps {
-  visible: boolean;
-  onClose: () => void;
-  modalConfirm: (value: string) => void;
-  textTitle?: string;
-  testID?: string;
-}
-
-export type { IModalActivityReasonProps };