From 0546cf5ce78eb6e35997564def6ab4220034e2a8 Mon Sep 17 00:00:00 2001 From: steve192 Date: Tue, 10 Jan 2023 23:24:46 +0100 Subject: [PATCH] draft --- package-lock.json | 53 +++++++- package.json | 6 +- .../weeklyrecipelist/WeeklyRecipeCard.tsx | 5 +- .../WeeklyRecipeListScreen.tsx | 122 +++++++++++------- 4 files changed, 128 insertions(+), 58 deletions(-) diff --git a/package-lock.json b/package-lock.json index a22b2291..0e4866d2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -41,10 +41,11 @@ "react-icons": "^4.3.1", "react-native": "0.70.5", "react-native-cache": "^2.0.2", + "react-native-drax": "^0.10.3", "react-native-gesture-handler": "~2.8.0", "react-native-pager-view": "5.4.15", "react-native-paper": "^4.11.1", - "react-native-reanimated": "~2.12.0", + "react-native-reanimated": "^2.13.0", "react-native-safe-area-context": "4.4.1", "react-native-screens": "~3.18.0", "react-native-vector-icons": "^9.1.0", @@ -25359,6 +25360,21 @@ "nullthrows": "^1.1.1" } }, + "node_modules/react-native-drax": { + "version": "0.10.3", + "resolved": "https://registry.npmjs.org/react-native-drax/-/react-native-drax-0.10.3.tgz", + "integrity": "sha512-44hoX5etOm3R4MK6YK5/w+lFFchQnPm/mt7FS20lnLqZtS5tfK+IEWRvk7dwUfEeOGEkHgFRFdbHiQKV98XQTQ==", + "dependencies": { + "lodash.isequal": "^4.5.0", + "lodash.throttle": "^4.1.1", + "typesafe-actions": "^5.1.0" + }, + "peerDependencies": { + "react": "*", + "react-native": ">=0.65.0", + "react-native-gesture-handler": ">=1.8.0" + } + }, "node_modules/react-native-gesture-handler": { "version": "2.8.0", "resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-2.8.0.tgz", @@ -25422,9 +25438,9 @@ } }, "node_modules/react-native-reanimated": { - "version": "2.12.0", - "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-2.12.0.tgz", - "integrity": "sha512-nrlPyw+Hx9u4iJhZk9PoTvDo/QmVAd+bo7OK9Tv3hveNEF9++5oig/g3Uv9V93shy9avTYGsUprUvAEt/xdzeQ==", + "version": "2.13.0", + "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-2.13.0.tgz", + "integrity": "sha512-yUHyYVIegWWIza4+nVyS3CSmI/Mc8kLFVHw2c6gnSHaYhYA4LeEjH/jBkoMzHk9Xd0Ra3cwtjYKAMG8OTp6JVg==", "dependencies": { "@babel/plugin-transform-object-assign": "^7.16.7", "@babel/preset-typescript": "^7.16.7", @@ -28424,6 +28440,14 @@ "integrity": "sha512-/aCDEGatGvZ2BIk+HmLf4ifCJFwvKFNb9/JeZPMulfgFracn9QFcAf5GO8B/mweUjSoblS5In0cWhqpfs/5PQA==", "dev": true }, + "node_modules/typesafe-actions": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/typesafe-actions/-/typesafe-actions-5.1.0.tgz", + "integrity": "sha512-bna6Yi1pRznoo6Bz1cE6btB/Yy8Xywytyfrzu/wc+NFW3ZF0I+2iCGImhBsoYYCOWuICtRO4yHcnDlzgo1AdNg==", + "engines": { + "node": ">= 4" + } + }, "node_modules/typescript": { "version": "4.9.3", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.3.tgz", @@ -51221,6 +51245,16 @@ "nullthrows": "^1.1.1" } }, + "react-native-drax": { + "version": "0.10.3", + "resolved": "https://registry.npmjs.org/react-native-drax/-/react-native-drax-0.10.3.tgz", + "integrity": "sha512-44hoX5etOm3R4MK6YK5/w+lFFchQnPm/mt7FS20lnLqZtS5tfK+IEWRvk7dwUfEeOGEkHgFRFdbHiQKV98XQTQ==", + "requires": { + "lodash.isequal": "^4.5.0", + "lodash.throttle": "^4.1.1", + "typesafe-actions": "^5.1.0" + } + }, "react-native-gesture-handler": { "version": "2.8.0", "resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-2.8.0.tgz", @@ -51272,9 +51306,9 @@ } }, "react-native-reanimated": { - "version": "2.12.0", - "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-2.12.0.tgz", - "integrity": "sha512-nrlPyw+Hx9u4iJhZk9PoTvDo/QmVAd+bo7OK9Tv3hveNEF9++5oig/g3Uv9V93shy9avTYGsUprUvAEt/xdzeQ==", + "version": "2.13.0", + "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-2.13.0.tgz", + "integrity": "sha512-yUHyYVIegWWIza4+nVyS3CSmI/Mc8kLFVHw2c6gnSHaYhYA4LeEjH/jBkoMzHk9Xd0Ra3cwtjYKAMG8OTp6JVg==", "requires": { "@babel/plugin-transform-object-assign": "^7.16.7", "@babel/preset-typescript": "^7.16.7", @@ -53648,6 +53682,11 @@ "integrity": "sha512-/aCDEGatGvZ2BIk+HmLf4ifCJFwvKFNb9/JeZPMulfgFracn9QFcAf5GO8B/mweUjSoblS5In0cWhqpfs/5PQA==", "dev": true }, + "typesafe-actions": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/typesafe-actions/-/typesafe-actions-5.1.0.tgz", + "integrity": "sha512-bna6Yi1pRznoo6Bz1cE6btB/Yy8Xywytyfrzu/wc+NFW3ZF0I+2iCGImhBsoYYCOWuICtRO4yHcnDlzgo1AdNg==" + }, "typescript": { "version": "4.9.3", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.3.tgz", diff --git a/package.json b/package.json index 534721d0..3369fc92 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,7 @@ "buffer": "^6.0.3", "expo": "^47.0.0", "expo-constants": "~14.0.2", + "expo-dev-client": "~2.0.1", "expo-file-system": "~15.1.1", "expo-image-picker": "~14.0.2", "expo-keep-awake": "~11.0.1", @@ -50,9 +51,11 @@ "react-icons": "^4.3.1", "react-native": "0.70.5", "react-native-cache": "^2.0.2", + "react-native-drax": "^0.10.3", "react-native-gesture-handler": "~2.8.0", "react-native-pager-view": "5.4.15", "react-native-paper": "^4.11.1", + "react-native-reanimated": "^2.13.0", "react-native-safe-area-context": "4.4.1", "react-native-screens": "~3.18.0", "react-native-vector-icons": "^9.1.0", @@ -62,8 +65,7 @@ "react-spacer": "^1.3.0", "recyclerlistview": "^4.2.0", "swiper": "^8.0.7", - "xdate": "^0.8.2", - "expo-dev-client": "~2.0.1" + "xdate": "^0.8.2" }, "devDependencies": { "@babel/core": "^7.19.3", diff --git a/src/screens/weeklyrecipelist/WeeklyRecipeCard.tsx b/src/screens/weeklyrecipelist/WeeklyRecipeCard.tsx index c0761a21..f16c77c2 100644 --- a/src/screens/weeklyrecipelist/WeeklyRecipeCard.tsx +++ b/src/screens/weeklyrecipelist/WeeklyRecipeCard.tsx @@ -18,8 +18,9 @@ export const WeeklyRecipeCard = (props: Props) => { setEditMode(!editMode)} - onPress={props.onPress}> + // onLongPress={() => setEditMode(!editMode)} + // onPress={props.on Press} + > {props.imageUuid && { weekdayDate.setDate(weekdayDate.getDate() + weekdayIndex); const existingWeekplanDay = weekplanDays.filter((weekplanDay) => weekplanDay.day === weekdayDate.toString(dateFormat))[0]; return ( - - - {weekday} {weekdayDate.toLocaleDateString()} - { - setRecipeSelectionVisible(true); - setSelectedWeekplanDay(existingWeekplanDay ? existingWeekplanDay : {day: weekdayDate.toString(dateFormat), recipes: []}); - } - } /> - - - {weekplanDays.filter((weekplanDay) => weekplanDay.day === weekdayDate.toString(dateFormat)).map((weekplanDay) => ( - weekplanDay.recipes.map((recipe, index) => { - if (recipe.type === 'NORMAL_RECIPE') { - return openRecipe(recipe.id)} - onRemovePress={() => removeRecipeFromWeekplanDay(index, weekplanDay)} - title={recipe.title} - imageUuid={recipe.titleImageUuid} />; - } else if (recipe.type === 'SIMPLE_RECIPE') { - return removeRecipeFromWeekplanDay(recipe.id, weekplanDay)} - title={recipe.title} />; + { + console.log(`received ${payload}`); + }}> + + + {weekday} {weekdayDate.toLocaleDateString()} + { + setRecipeSelectionVisible(true); + setSelectedWeekplanDay(existingWeekplanDay ? existingWeekplanDay : {day: weekdayDate.toString(dateFormat), recipes: []}); } - }) - ))} - - + } /> + + + {weekplanDays.filter((weekplanDay) => weekplanDay.day === weekdayDate.toString(dateFormat)).map((weekplanDay) => ( + weekplanDay.recipes.map((recipe, index) => { + if (recipe.type === 'NORMAL_RECIPE') { + return ( + { + console.log('start drag'); + }} + draggable={true} + dragPayload="world"> + openRecipe(recipe.id)} + onRemovePress={() => removeRecipeFromWeekplanDay(index, weekplanDay)} + title={recipe.title} + imageUuid={recipe.titleImageUuid} /> + + ); + } else if (recipe.type === 'SIMPLE_RECIPE') { + return removeRecipeFromWeekplanDay(recipe.id, weekplanDay)} + title={recipe.title} />; + } + }) + ))} + + + ); }); }; + const wrapGuestureHandlerIfNeeded = (children: React.Element) => { + /* Needed to make drax work on android */ + if (Platform.OS === 'web') { + return {children}; + } else { + return {children}; + } + }; + return ( <> - - {t('screens.weekplan.currentWeek')} - {renderWeek(getCurrentWeekNumber(now), now.getFullYear())} - - {t('screens.weekplan.nextWeek')} - {renderWeek(getCurrentWeekNumber(now) + 1, now.getFullYear())} - - {t('screens.weekplan.week')} {getCurrentWeekNumber(now) + 2} - {renderWeek(getCurrentWeekNumber(now) + 2, now.getFullYear())} - - {t('screens.weekplan.week')} {getCurrentWeekNumber(now) + 3} - {renderWeek(getCurrentWeekNumber(now) + 3, now.getFullYear())} - + + {wrapGuestureHandlerIfNeeded(<> + {t('screens.weekplan.currentWeek')} + {renderWeek(getCurrentWeekNumber(now), now.getFullYear())} + + {t('screens.weekplan.nextWeek')} + {renderWeek(getCurrentWeekNumber(now) + 1, now.getFullYear())} + + {t('screens.weekplan.week')} {getCurrentWeekNumber(now) + 2} + {renderWeek(getCurrentWeekNumber(now) + 2, now.getFullYear())} + + {t('screens.weekplan.week')} {getCurrentWeekNumber(now) + 3} + {renderWeek(getCurrentWeekNumber(now) + 3, now.getFullYear())})} +