react-native-exp-fig 0.1.34 → 0.1.35

package/src/common/icons-svg/carrier/inde.tsx

@@ -0,0 +1,31 @@
+/**
+ * IMPORTS
+ */
+import * as React from "react";
+import Svg, { Path } from "react-native-svg";
+
+//typings
+import { ISvgProps } from "../interface";
+
+const SvgIconCarrier: React.FC<ISvgProps> = ({ color, size = 17 }) => (
+  <Svg
+    //@ts-ignore
+    xmlns="http://www.w3.org/2000/svg"
+    width={size}
+    height={size - 2}
+    fill="none"
+    viewBox="0 0 17 15"
+  >
+    <Path
+      fill={color ?? "#2BA20D"}
+      fillRule="evenodd"
+      d="M15.938 13.125c0 .516-.477.938-1.063.938H2.125c-.586 0-1.062-.422-1.062-.938V1.875c0-.516.476-.937 1.062-.937h12.75c.586 0 1.063.421 1.063.937zM14.875 0H2.125C.951 0 0 .84 0 1.875v11.25C0 14.161.951 15 2.125 15h12.75C16.049 15 17 14.16 17 13.125V1.875C17 .839 16.049 0 14.875 0m-3.187 7.031H9.03V4.688c0-.258-.238-.47-.531-.47s-.531.212-.531.47V7.03H5.312c-.293 0-.53.211-.53.469s.237.469.53.469H7.97v2.343c0 .258.238.47.531.47s.531-.212.531-.47V7.97h2.656c.294 0 .532-.211.532-.469s-.238-.469-.531-.469"
+      clipRule="evenodd"
+    ></Path>
+  </Svg>
+);
+
+/**
+ * EXPORTS
+ */
+export { SvgIconCarrier };

package/src/common/icons-svg/constants/index.ts

@@ -59,6 +59,7 @@ const SVG_NAME = {
   ISLAND: "island",
   EXCLAMATION_TRIANGLE: "exclamation-triangle",
   SCALES: "scales",
+  CARRIER: "carrier",
 };
 
 /**

package/src/common/icons-svg/index.tsx

@@ -59,6 +59,7 @@ import { SvgPackage } from "./package";
 import { SvgIconHouse } from "./house";
 import { SvgIconWarningTriangle } from "./eclamation-triangle";
 import { SvgIconScales } from "./scales";
+import { SvgIconCarrier } from "./carrier/inde";
 
 // typing
 import { ISvgProps } from "./interface";
@@ -162,6 +163,9 @@ const Icons: React.FC<ISvgProps> = ({ icon, color, size, background }) => {
     case "NOTE_PINCEL":
       return <SvgIconNotePencil color={color} size={size} icon={"NOTE_PINCEL"} />;
 
+    case "CARRIER":
+      return <SvgIconCarrier color={color} size={size} icon={"CARRIER"} />;
+
     case "CHECK_CIRCLE":
       return (
         <SvgIconCheckCircle

package/src/components/activity-timeline/components/activite-row/index.tsx

@@ -1,133 +1,134 @@
-/**
- * IMPORTS
- */
-import React, { forwardRef, useCallback } from "react";
-import { TouchableOpacity, View } from "react-native";
-
-// components
-import { Typography } from "../../../../components/typography";
-
-// commons / svg
-import { Icons } from "../../../../common/icons-svg";
-
-// typings
-import type { IActivitieRowProps } from "../../interface";
-import { asBaseComponent } from "../../../../@types/as-base-component";
-
-// styles
-import { theme } from "../../../../styles/theme/theme";
-import { styles } from "../../styles";
-
-/**
- * Componente ActivityRows para a interação da ui.
- */
-const ActivityRows = forwardRef<any, IActivitieRowProps<any>>(
-  ({ index, activities, items, onAdd, onEdit, onDelete }, ref): React.ReactElement => {
-    const handleAdd = useCallback(() => onAdd(activities), [onAdd, activities]);
-    const handleEdit = useCallback(() => onEdit(activities), [onEdit, activities]);
-    const handleDelete = useCallback(() => onDelete(activities), [onDelete, activities]);
-
-    const isInvalid = !!activities.invalid;
-
-    const dateText =
-      activities.date instanceof Date
-        ? `${String(activities.date.getDate()).padStart(2, "0")}/${String(
-            activities.date.getMonth() + 1
-          ).padStart(2, "0")}/${activities.date.getFullYear()}`
-        : String(activities.date ?? "");
-
-    const timeText =
-      activities.time instanceof Date
-        ? `${String(activities.time.getHours()).padStart(2, "0")}:${String(
-            activities.time.getMinutes()
-          ).padStart(2, "0")}`
-        : String(activities.time ?? "");
-
-    return (
-      <View ref={ref} style={styles.row}>
-        <View style={styles.badge}>
-          <Typography
-            text={String(index + 1)}
-            color={theme.colors.neutral[25]}
-            size={theme.fontSizes.sm}
-            fontFamily={theme.fonts.inter_bold_700}
-          />
-        </View>
-
-        {Boolean(index !== items?.length - 1) && (
-          <View
-            style={{
-              width: 2,
-              height: 76,
-              backgroundColor: theme.colors.blue[500],
-              position: "absolute",
-              left: 21,
-              top: 60,
-            }}
-          />
-        )}
-
-        <View style={styles.card}>
-          <Typography
-            numberOfLines={1}
-            style={styles.title}
-            text={activities.title ?? "Não informada"}
-            color={isInvalid ? theme.colors.red[900] : theme.colors.blue[500]}
-            size={14}
-            fontFamily={theme.fonts.inter_medium_500}
-            lineHeight={34}
-          />
-
-          <View style={[styles.pill, isInvalid ? styles.pillInvalid : styles.pillOk]}>
-            <Icons
-              icon="CALENDAR"
-              size={18}
-              color={isInvalid ? theme.colors.red[900] : theme.colors.blue[500]}
-            />
-            <Typography
-              text={dateText}
-              color={isInvalid ? theme.colors.red[800] : theme.colors.blue[400]}
-              size={theme.fontSizes.xs}
-              fontFamily={theme.fonts.inter_medium_500}
-            />
-            <Typography
-              text="|"
-              color={isInvalid ? theme.colors.red[800] : theme.colors.blue[400]}
-              size={theme.fontSizes.sm}
-              style={styles.sep}
-            />
-            <Typography
-              text={timeText}
-              color={isInvalid ? theme.colors.red[800] : theme.colors.blue[500]}
-              size={theme.fontSizes.xs}
-              fontFamily={theme.fonts.inter_medium_500}
-            />
-          </View>
-        </View>
-
-        <View style={styles.actions}>
-          <TouchableOpacity style={styles.iconButton} onPress={handleEdit} testID="edit-activity">
-            <Icons icon="NOTE_PINCEL" size={18} color={theme.colors.blue[350]} />
-          </TouchableOpacity>
-
-          <TouchableOpacity style={styles.iconButton} onPress={handleAdd} testID="add-after-activity">
-            {/* Não há PLUS_CONTAINER, usando PLUS como alternativa visual */}
-            <Icons icon="PLUS" size={18} color={theme.colors.green[500]} />
-          </TouchableOpacity>
-
-          <TouchableOpacity style={styles.iconButton} onPress={handleDelete} testID="delete-activity">
-            {/* Não há TRASH, usando X_CIRCLE como alternativa de remover */}
-            <Icons icon="X_CIRCLE" size={18} color={theme.colors.red[900]} />
-          </TouchableOpacity>
-        </View>
-      </View>
-    );
-  }
-);
-
-ActivityRows.displayName = "ActivityRows";
-
-/**
- * EXPORTS
- */
-export default asBaseComponent(ActivityRows);
+/**
+ * IMPORTS
+ */
+import React, { forwardRef, useCallback } from "react";
+import { TouchableOpacity, View } from "react-native";
+
+// components
+import { Typography } from "../../../../components/typography";
+
+// commons / svg
+import { Icons } from "../../../../common/icons-svg";
+
+// utils
+import { formHoursMinute } from "../../../../utils/format-data";
+
+// typings
+import type { IActivitieRowProps } from "../../interface";
+import { asBaseComponent } from "../../../../@types/as-base-component";
+
+// styles
+import { theme } from "../../../../styles/theme/theme";
+import { styles } from "../../styles";
+
+/**
+ * Componente ActivityRows para a interação da ui.
+ */
+const ActivityRows = forwardRef<any, IActivitieRowProps>(
+  ({ index, activities, items, onAdd, onEdit, onDelete }, ref): React.ReactElement => {
+    const handleAdd = useCallback(() => onAdd(activities), [onAdd, activities]);
+    const handleEdit = useCallback(() => onEdit(activities), [onEdit, activities]);
+    const handleDelete = useCallback(() => onDelete(activities), [onDelete, activities]);
+
+    const isInvalid = formHoursMinute(activities?.duracao_segundos as string) === "00:00";
+
+    const dateStart = activities.data_inicio;
+
+    const timeText = formHoursMinute(activities?.duracao_segundos as string);
+
+    return (
+      <View ref={ref} style={styles.row}>
+        <View style={styles.badge}>
+          <Typography
+            text={String(index + 1)}
+            color={theme.colors.neutral[25]}
+            size={theme.fontSizes.sm}
+            fontFamily={theme.fonts.inter_bold_700}
+          />
+        </View>
+
+        {Boolean(index !== items?.length - 1) && (
+          <View
+            style={{
+              width: 2,
+              height: 76,
+              backgroundColor: theme.colors.blue[500],
+              position: "absolute",
+              left: 21,
+              top: 60,
+            }}
+          />
+        )}
+
+        <View style={styles.card}>
+          <Typography
+            numberOfLines={1}
+            style={styles.title}
+            text={activities.descricao ?? "Não informada"}
+            color={isInvalid ? theme.colors.red[900] : theme.colors.blue[500]}
+            size={14}
+            fontFamily={theme.fonts.inter_medium_500}
+            lineHeight={34}
+          />
+
+          <View style={[styles.pill, isInvalid ? styles.pillInvalid : styles.pillOk]}>
+            <Icons
+              icon="CALENDAR"
+              size={18}
+              color={isInvalid ? theme.colors.red[900] : theme.colors.blue[500]}
+            />
+            <Typography
+              text={dateStart}
+              color={isInvalid ? theme.colors.red[800] : theme.colors.blue[400]}
+              size={theme.fontSizes.xs}
+              fontFamily={theme.fonts.inter_medium_500}
+            />
+            <Typography
+              text="|"
+              color={isInvalid ? theme.colors.red[800] : theme.colors.blue[400]}
+              size={theme.fontSizes.sm}
+              style={styles.sep}
+            />
+            <Typography
+              text={timeText}
+              color={isInvalid ? theme.colors.red[800] : theme.colors.blue[500]}
+              size={theme.fontSizes.xs}
+              fontFamily={theme.fonts.inter_medium_500}
+            />
+          </View>
+        </View>
+
+        <View style={styles.actions}>
+          <TouchableOpacity style={styles.iconButton} onPress={handleEdit} testID="edit-activity">
+            <Icons icon="NOTE_PINCEL" size={18} color={theme.colors.blue[350]} />
+          </TouchableOpacity>
+
+          <TouchableOpacity
+            style={styles.iconButton}
+            onPress={handleAdd}
+            testID="add-after-activity"
+          >
+            {/* Não há PLUS_CONTAINER, usando PLUS como alternativa visual */}
+            <Icons icon="CARRIER" size={18} color={theme.colors.green[500]} />
+          </TouchableOpacity>
+
+          <TouchableOpacity
+            style={styles.iconButton}
+            onPress={handleDelete}
+            testID="delete-activity"
+          >
+            {/* Não há TRASH, usando X_CIRCLE como alternativa de remover */}
+            <Icons icon="X_CIRCLE" size={18} color={theme.colors.red[900]} />
+          </TouchableOpacity>
+        </View>
+      </View>
+    );
+  }
+);
+
+ActivityRows.displayName = "ActivityRows";
+
+/**
+ * EXPORTS
+ */
+export default asBaseComponent(ActivityRows);

package/src/components/activity-timeline/index.tsx

@@ -1,72 +1,72 @@
-/**
- * IMPORTS
- */
-import React, { forwardRef, useCallback } from "react";
-import { View, FlatList } from "react-native";
-
-// components
-import ActivityRows from "./components/activite-row";
-
-// typings
-import type { ActivityItemModel, ActivityTimelineProps } from "./interface";
-import { asBaseComponent } from "../../@types/as-base-component";
-
-// styles
-import { styles, ROW_HEIGHT } from "./styles";
-
-/**
- * Componente ActivityTimeline para a interação da ui.
- */
-const ActivityTimeline = forwardRef<any, ActivityTimelineProps<any>>(
-  (
-    { data, onAdd, onEdit, onDelete, showIndexBadge = true, testID = "activity-timeline" },
-    ref
-  ): React.ReactElement => {
-    const keyExtractor = useCallback((it: ActivityItemModel) => String(it.id), []);
-
-    const renderItem = useCallback(
-      ({ item, index }: { item: ActivityItemModel; index: number }) => (
-        <ActivityRows
-          index={index}
-          items={data}
-          activities={item}
-          onAdd={onAdd}
-          onEdit={onEdit}
-          onDelete={onDelete}
-          showIndexBadge={showIndexBadge}
-        />
-      ),
-      [onAdd, onEdit, onDelete, showIndexBadge]
-    );
-
-    const getItemLayout = useCallback(
-      (_: any, index: number) => ({
-        length: ROW_HEIGHT,
-        offset: ROW_HEIGHT * index,
-        index,
-      }),
-      []
-    );
-    return (
-      <FlatList
-        ref={ref}
-        testID={testID}
-        data={data}
-        keyExtractor={keyExtractor}
-        renderItem={renderItem}
-        contentContainerStyle={styles.listContainer}
-        getItemLayout={getItemLayout}
-        initialNumToRender={10}
-        maxToRenderPerBatch={10}
-        removeClippedSubviews
-        windowSize={7}
-        ListEmptyComponent={<View style={{ height: 8 }} />}
-      />
-    );
-  }
-);
-
-/**
- * EXPORTS
- */
-export default asBaseComponent(ActivityTimeline);
+/**
+ * IMPORTS
+ */
+import React, { forwardRef, useCallback } from "react";
+import { View, FlatList } from "react-native";
+
+// components
+import ActivityRows from "./components/activite-row";
+
+// typings
+import type { ActivityItemModel, ActivityTimelineProps, IDataActivityProps } from "./interface";
+import { asBaseComponent } from "../../@types/as-base-component";
+
+// styles
+import { styles, ROW_HEIGHT } from "./styles";
+
+/**
+ * Componente ActivityTimeline para a interação da ui.
+ */
+const ActivityTimeline = forwardRef<any, ActivityTimelineProps>(
+  (
+    { data, onAdd, onEdit, onDelete, showIndexBadge = true, testID = "activity-timeline" },
+    ref
+  ): React.ReactElement => {
+    const keyExtractor = useCallback((it: ActivityItemModel) => String(it.id), []);
+
+    const renderItem = useCallback(
+      ({ item, index }: { item: IDataActivityProps; index: number }) => (
+        <ActivityRows
+          index={index}
+          items={data}
+          activities={item}
+          onAdd={onAdd}
+          onEdit={onEdit}
+          onDelete={onDelete}
+          showIndexBadge={showIndexBadge}
+        />
+      ),
+      [onAdd, onEdit, onDelete, showIndexBadge]
+    );
+
+    const getItemLayout = useCallback(
+      (_: any, index: number) => ({
+        length: ROW_HEIGHT,
+        offset: ROW_HEIGHT * index,
+        index,
+      }),
+      []
+    );
+    return (
+      <FlatList
+        ref={ref}
+        testID={testID}
+        data={data as any[]}
+        keyExtractor={keyExtractor}
+        renderItem={renderItem as any}
+        contentContainerStyle={styles.listContainer}
+        getItemLayout={getItemLayout}
+        initialNumToRender={10}
+        maxToRenderPerBatch={10}
+        removeClippedSubviews
+        windowSize={10}
+        ListEmptyComponent={<View style={{ height: 8 }} />}
+      />
+    );
+  }
+);
+
+/**
+ * EXPORTS
+ */
+export default asBaseComponent(ActivityTimeline);

package/src/components/activity-timeline/interface.ts

@@ -1,53 +1,67 @@
-/**
- * IMPORTS
- */
-import type { TouchableOpacityProps } from "react-native";
-import type { SVG_NAME } from "../../common/icons-svg/constants";
-
-/**
- * TYPES
- */
-type ActivityId = string | number;
-
-type ActivityItemModel = {
-  id: ActivityId;
-  title: string; // "Operação com veículo", "Refeição", ...
-  date: Date | string; // pode vir Date ou string já formatada
-  time: Date | string; // idem
-  invalid?: boolean; // destaca em vermelho
-};
-
-type IconName = keyof typeof SVG_NAME;
-
-type OnActivity = (item: ActivityItemModel) => void;
-
-type ActivityTimelineProps<T> = TouchableOpacityProps & {
-  data: T[];
-  onAdd: OnActivity; // add novo após o item
-  onEdit: OnActivity;
-  onDelete: OnActivity;
-  showIndexBadge?: boolean; // mostra o “3/4/5”
-  testID?: string;
-};
-
-type IActivitieRowProps<T> = {
-  index: number;
-  activities: ActivityItemModel;
-  items: T[];
-  onAdd: OnActivity;
-  onEdit: OnActivity;
-  onDelete: OnActivity;
-  showIndexBadge?: boolean;
-};
-
-/**
- * EXPORTS
- */
-export type {
-  ActivityId,
-  ActivityItemModel,
-  IconName,
-  OnActivity,
-  ActivityTimelineProps,
-  IActivitieRowProps,
-};
+/* eslint-disable no-unused-vars */
+/**
+ * IMPORTS
+ */
+import type { TouchableOpacityProps } from "react-native";
+import type { SVG_NAME } from "../../common/icons-svg/constants";
+
+/**
+ * TYPES
+ */
+type ActivityId = string | number;
+
+type ActivityItemModel = {
+  id: ActivityId;
+  title: string; // "Operação com veículo", "Refeição", ...
+  date: Date | string; // pode vir Date ou string já formatada
+  time: Date | string; // idem
+  invalid?: boolean; // destaca em vermelho
+};
+
+type IDataActivityProps = {
+  id?: number | string;
+  ec_tipo_atividade_id?: number;
+  duracao_segundos: string | number;
+  data_inicio: string;
+  data_fim: string;
+  descricao: string;
+  sincronizado: boolean;
+  tipo: string;
+  referencia: string;
+};
+
+type IconName = keyof typeof SVG_NAME;
+
+type OnActivity = (item: IDataActivityProps) => void;
+
+type ActivityTimelineProps = TouchableOpacityProps & {
+  data: IDataActivityProps[];
+  onAdd: OnActivity; // add novo após o item
+  onEdit: OnActivity;
+  onDelete: OnActivity;
+  showIndexBadge?: boolean; // mostra o “3/4/5”
+  testID?: string;
+};
+
+type IActivitieRowProps = {
+  index: number;
+  activities: IDataActivityProps;
+  items: IDataActivityProps[];
+  onAdd: OnActivity;
+  onEdit: OnActivity;
+  onDelete: OnActivity;
+  showIndexBadge?: boolean;
+};
+
+/**
+ * EXPORTS
+ */
+export type {
+  ActivityId,
+  ActivityItemModel,
+  IconName,
+  OnActivity,
+  ActivityTimelineProps,
+  IActivitieRowProps,
+  IDataActivityProps,
+};