admin/imexmobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Minor cleanup and add KeyboardAvoidingView to global search.

Browse Source
This commit is contained in:
Patrick Fic
2025-10-29 10:22:31 -07:00
parent 9c5ee8ed16
commit 0ae416cc90
12 changed files with 129 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
babel-translations.babel
View File

@@ -639,6 +639,27 @@
</translation> </translation>
</translations> </translations>
</concept_node> </concept_node>
<concept_node>
<name>status</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
</children> </children>
</folder_node> </folder_node>
<folder_node> <folder_node>

28
components/global-search/global-search.jsx
View File

@@ -3,7 +3,7 @@ import { useLocalSearchParams } from "expo-router";
import debounce from "lodash/debounce"; import debounce from "lodash/debounce";
import { useCallback, useEffect, useRef, useState } from "react"; import { useCallback, useEffect, useRef, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { FlatList, View } from "react-native"; import { FlatList, KeyboardAvoidingView, Platform } from "react-native";
import { ActivityIndicator, Icon, Text } from "react-native-paper"; import { ActivityIndicator, Icon, Text } from "react-native-paper";
import env from "../../env"; import env from "../../env";
import ErrorDisplay from "../error/error-display"; import ErrorDisplay from "../error/error-display";
@@ -40,7 +40,7 @@ export default function GlobalSearch() {
const [error, setError] = useState(null); const [error, setError] = useState(null);
const [results, setResults] = useState([]); const [results, setResults] = useState([]);
const { t } = useTranslation(); const { t } = useTranslation();
// Placeholder: Replace with actual API call (e.g., Apollo client query, REST fetch, Redux saga dispatch)
const performSearch = useCallback(async (query) => { const performSearch = useCallback(async (query) => {
// Defensive trimr // Defensive trimr
const q = (query || "").trim(); const q = (query || "").trim();
@@ -57,7 +57,7 @@ export default function GlobalSearch() {
?.filter((hit) => hit._index === "jobs") ?.filter((hit) => hit._index === "jobs")
.map((hit) => hit._source); .map((hit) => hit._source);
setResults(jobResults); setResults([...jobResults, { id: "footer-spacer", height: 128 }]);
} else { } else {
setError("No results available. Try again."); setError("No results available. Try again.");
} }
@@ -79,23 +79,35 @@ export default function GlobalSearch() {
if (globalSearch === undefined || globalSearch.trim() === "") { if (globalSearch === undefined || globalSearch.trim() === "") {
return ( return (
<View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}> <KeyboardAvoidingView
behavior={Platform.OS === "ios" ? "padding" : "height"}
style={{
flex: 1,
justifyContent: "center",
alignItems: "center",
}}
>
<Icon size={64} source="cloud-search" /> <Icon size={64} source="cloud-search" />
<Text variant="bodyMedium" style={{ margin: 12, textAlign: "center" }}> <Text variant="bodyMedium" style={{ margin: 12, textAlign: "center" }}>
{t("globalsearch.labels.entersearch")} {t("globalsearch.labels.entersearch")}
</Text> </Text>
</View> </KeyboardAvoidingView>
); );
} }
return ( return (
<View style={{ flex: 1 }}> <KeyboardAvoidingView
{loading && <ActivityIndicator size="large" />} style={{ flex: 1 }}
behavior={Platform.OS === "ios" ? "padding" : "height"}
>
{loading && <ActivityIndicator size="large" style={{ margin: 24 }} />}
{error && <ErrorDisplay errorMessage={error} />} {error && <ErrorDisplay errorMessage={error} />}
{!loading && (
<Text variant="titleSmall" style={{ margin: 12, alignSelf: "center" }}> <Text variant="titleSmall" style={{ margin: 12, alignSelf: "center" }}>
{results.length} results found {results.length} results found
</Text> </Text>
)}
<FlatList <FlatList
style={{ flex: 1 }} style={{ flex: 1 }}
@@ -103,6 +115,6 @@ export default function GlobalSearch() {
keyExtractor={(item) => item.id?.toString()} keyExtractor={(item) => item.id?.toString()}
renderItem={(object) => <JobListItem item={object.item} />} renderItem={(object) => <JobListItem item={object.item} />}
/> />
</View> </KeyboardAvoidingView>
); );
} }

79
components/job-notes/job-notes.jsx
View File

@@ -3,10 +3,16 @@ import { useQuery } from "@apollo/client";
import { AntDesign } from "@expo/vector-icons"; import { AntDesign } from "@expo/vector-icons";
import { useGlobalSearchParams } from "expo-router"; import { useGlobalSearchParams } from "expo-router";
import { DateTime } from "luxon"; import { DateTime } from "luxon";
import React, { useCallback, useState } from "react"; import React, { memo, useCallback, useMemo, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { FlatList, RefreshControl, View } from "react-native"; import { FlatList, RefreshControl, View } from "react-native";
import { ActivityIndicator, Button, Card, Text } from "react-native-paper"; import {
ActivityIndicator,
Button,
Card,
Divider,
Text,
} from "react-native-paper";
import ErrorDisplay from "../error/error-display"; import ErrorDisplay from "../error/error-display";
import NewNoteModal from "./new-note-modal"; import NewNoteModal from "./new-note-modal";
@@ -33,17 +39,41 @@ export default function JobNotes() {
return refetch(); return refetch();
}; };
const job = data?.jobs_by_pk;
// Memoized list data (only when job & notes exist)
const listData = useMemo(() => {
if (!job?.notes) return [];
const notes = job.notes;
const pinnedNotes = [];
const otherNotes = [];
for (const n of notes) {
(n.pinned ? pinnedNotes : otherNotes).push(n);
}
pinnedNotes.sort((a, b) => new Date(b.created_at) - new Date(a.created_at));
otherNotes.sort((a, b) => new Date(b.created_at) - new Date(a.created_at));
const DIVIDER_ID = "__divider__";
return pinnedNotes.length > 0 && otherNotes.length > 0
? [...pinnedNotes, { id: DIVIDER_ID, type: "divider" }, ...otherNotes]
: [...pinnedNotes, ...otherNotes];
}, [job?.notes]);
const keyExtractor = useCallback((item) => item.id, []);
const renderItem = useCallback(
({ item }) =>
item.type === "divider" ? <DividerItem /> : <NoteListItem item={item} />,
[]
);
if (loading) { if (loading) {
return <ActivityIndicator size="large" style={{ flex: 1 }} />; return <ActivityIndicator size="large" style={{ flex: 1 }} />;
} }
if (error) { if (error) {
return <ErrorDisplay message={JSON.stringify(error?.message)} />; return <ErrorDisplay message={JSON.stringify(error?.message)} />;
} }
if (!job) {
if (!data?.jobs_by_pk) {
return <ErrorDisplay errorMessage={"Job is not defined."} />; return <ErrorDisplay errorMessage={"Job is not defined."} />;
} }
const job = data.jobs_by_pk;
return ( return (
<View style={{ flex: 1, display: "flex" }}> <View style={{ flex: 1, display: "flex" }}>
@@ -55,7 +85,7 @@ export default function JobNotes() {
> >
{t("jobdetail.actions.addnote")} {t("jobdetail.actions.addnote")}
</Button> </Button>
{job.notes.length === 0 ? ( {listData.length === 0 ? (
<Card> <Card>
<Card.Content> <Card.Content>
<Text>{t("jobdetail.labels.nojobnotes")}</Text> <Text>{t("jobdetail.labels.nojobnotes")}</Text>
@@ -67,8 +97,13 @@ export default function JobNotes() {
<RefreshControl refreshing={loading} onRefresh={onRefresh} /> <RefreshControl refreshing={loading} onRefresh={onRefresh} />
} }
style={{ flex: 1 }} style={{ flex: 1 }}
data={job.notes} data={listData}
renderItem={(object) => <NoteListItem item={object.item} />} keyExtractor={keyExtractor}
renderItem={renderItem}
removeClippedSubviews
initialNumToRender={12}
maxToRenderPerBatch={8}
windowSize={7}
/> />
)} )}
<NewNoteModal <NewNoteModal
@@ -82,7 +117,7 @@ export default function JobNotes() {
); );
} }
function NoteListItem({ item }) { const NoteListItem = memo(function NoteListItem({ item }) {
return ( return (
<Card style={{ margin: 8 }}> <Card style={{ margin: 8 }}>
<Card.Content> <Card.Content>
@@ -90,26 +125,20 @@ function NoteListItem({ item }) {
<Text>{item.text}</Text> <Text>{item.text}</Text>
<View <View
style={{ style={{
flexDirection: "column", flexDirection: "row",
alignSelf: "flex-end", alignSelf: "flex-end",
alignItems: "center", alignItems: "center",
gap: 8,
}} }}
> >
{item.pinned && (
<AntDesign name="pushpin" size={24} color="dodgerblue" />
)}
{item.private && ( {item.private && (
<AntDesign <AntDesign name="eye-invisible" size={24} color="black" />
name="eye-invisible"
style={{ margin: 4 }}
size={24}
color="black"
/>
)} )}
{item.critical && ( {item.critical && (
<AntDesign <AntDesign name="warning" size={24} color="tomato" />
name="warning"
style={{ margin: 4 }}
size={24}
color="tomato"
/>
)} )}
<Text style={{ fontSize: 12 }}>{item.created_by}</Text> <Text style={{ fontSize: 12 }}>{item.created_by}</Text>
<Text style={{ fontSize: 12 }}> <Text style={{ fontSize: 12 }}>
@@ -122,4 +151,8 @@ function NoteListItem({ item }) {
</Card.Content> </Card.Content>
</Card> </Card>
); );
} });
const DividerItem = memo(function DividerItem() {
return <Divider bold style={{ margin: 12 }} />;
});

11
components/job-notes/new-note-modal.jsx
View File

@@ -124,7 +124,7 @@ const NewNoteModal = ({
type: values.type, type: values.type,
created_by: currentUser?.email, created_by: currentUser?.email,
}; };
console.log("*** ~ handleSubmit ~ noteInput:", noteInput);
// TODO: If backend supports attaching note to multiple related ROs, perform additional mutation(s) // TODO: If backend supports attaching note to multiple related ROs, perform additional mutation(s)
// here after creating the base note. This may involve an insert into a join table like note_jobs. // here after creating the base note. This may involve an insert into a join table like note_jobs.
// values.relatedros contains boolean flags keyed by job id. // values.relatedros contains boolean flags keyed by job id.
@@ -272,7 +272,12 @@ const NewNoteModal = ({
{ paddingBottom: Math.max(insets.bottom, 12) }, { paddingBottom: Math.max(insets.bottom, 12) },
]} ]}
> >
<Button onPress={onDismiss} mode="text"> <Button
onPress={onDismiss}
mode="text"
disabled={loading}
icon="close"
>
{t("general.actions.cancel")} {t("general.actions.cancel")}
</Button> </Button>
<Button <Button
@@ -280,6 +285,7 @@ const NewNoteModal = ({
mode="contained" mode="contained"
loading={loading} loading={loading}
disabled={loading || !values.text.trim()} disabled={loading || !values.text.trim()}
icon="plus"
> >
{existingNote {existingNote
? t("general.actions.save") ? t("general.actions.save")
@@ -361,6 +367,7 @@ const styles = StyleSheet.create({
flexDirection: "row", flexDirection: "row",
justifyContent: "flex-end", justifyContent: "flex-end",
marginTop: 16, marginTop: 16,
gap: 12,
}, },
scrollContent: { scrollContent: {
// paddingBottom: 24, // paddingBottom: 24,

1
components/job-status-selector/job-status-selector.jsx
View File

@@ -107,6 +107,7 @@ export const JobStatusSelector = ({
const styles = StyleSheet.create({ const styles = StyleSheet.create({
root: { root: {
alignSelf: "flex-start", alignSelf: "flex-start",
paddingTop: 4,
}, },
trigger: { trigger: {
minWidth: 140, minWidth: 140,

2
components/job-tombstone/job-tombstone.jsx
View File

@@ -107,7 +107,7 @@ function JobTombstone({ bodyshop }) {
<JobStatusSelector <JobStatusSelector
statuses={availableStatuses} statuses={availableStatuses}
currentStatus={job.status} currentStatus={job.status}
label={t("jobdetail.labels.jobstatus")} label={t("jobdetail.labels.status")}
/> />
} }
/> />

5
components/jobs-list/job-list-item.jsx
View File

@@ -43,7 +43,7 @@ function JobListItemComponent({ openImagePicker, item }) {
const roNumber = item.ro_number || t("general.labels.na"); const roNumber = item.ro_number || t("general.labels.na");
if (item.id === "footer-spacer") { if (item.id === "footer-spacer") {
return <View style={{ height: 64 }} />; return <View style={{ height: item.height || 64 }} />;
} }
return ( return (
<Pressable <Pressable
@@ -76,7 +76,6 @@ function JobListItemComponent({ openImagePicker, item }) {
</View> </View>
</View> </View>
<View style={styles.body}> <View style={styles.body}>
{!!vehicle && (
<Text <Text
variant="bodyMedium" variant="bodyMedium"
numberOfLines={1} numberOfLines={1}
@@ -84,7 +83,7 @@ function JobListItemComponent({ openImagePicker, item }) {
> >
{vehicle} {vehicle}
</Text> </Text>
)}
<Chip style>{item.status}</Chip> <Chip style>{item.status}</Chip>
</View> </View>
</View> </View>

1
components/settings/settings.jsx
View File

@@ -136,6 +136,7 @@ function Tab({ bodyshop, currentUser, signOutStart }) {
<Card.Actions> <Card.Actions>
<Button <Button
icon="bell-outline" icon="bell-outline"
disabled={permissionState?.granted === true}
onPress={async () => { onPress={async () => {
try { try {
await registerForPushNotificationsAsync(); await registerForPushNotificationsAsync();

3
graphql/jobs.queries.js
View File

@@ -1,4 +1,4 @@
import gql from "graphql-tag"; import { gql } from "graphql-tag";
export const QUERY_ALL_ACTIVE_JOBS = gql` export const QUERY_ALL_ACTIVE_JOBS = gql`
query QUERY_ALL_ACTIVE_JOBS($statuses: [String!]!) { query QUERY_ALL_ACTIVE_JOBS($statuses: [String!]!) {
@@ -208,6 +208,7 @@ export const GET_JOB_BY_PK = gql`
text text
critical critical
private private
pinned
created_at created_at
updated_at updated_at
created_by created_by

3
translations/en-US/common.json
View File

@@ -46,7 +46,8 @@
"lines_price": "$", "lines_price": "$",
"lines_qty": "Qty.", "lines_qty": "Qty.",
"nojobnotes": "There are no notes.", "nojobnotes": "There are no notes.",
"notes": "Notes" "notes": "Notes",
"status": "Status"
}, },
"lbr_types": { "lbr_types": {
"LA1": "LA1", "LA1": "LA1",

3
translations/es-MX/common.json
View File

@@ -46,7 +46,8 @@
"lines_price": "", "lines_price": "",
"lines_qty": "", "lines_qty": "",
"nojobnotes": "", "nojobnotes": "",
"notes": "" "notes": "",
"status": ""
}, },
"lbr_types": { "lbr_types": {
"LA1": "", "LA1": "",

3
translations/fr-CA/common.json
View File

@@ -46,7 +46,8 @@
"lines_price": "", "lines_price": "",
"lines_qty": "", "lines_qty": "",
"nojobnotes": "", "nojobnotes": "",
"notes": "" "notes": "",
"status": ""
}, },
"lbr_types": { "lbr_types": {
"LA1": "", "LA1": "",