parent
1a289f1b7b
commit
2e96398b38
124
EditPlan.tsx
124
EditPlan.tsx
|
@ -5,17 +5,25 @@ import {
|
||||||
useRoute,
|
useRoute,
|
||||||
} from "@react-navigation/native";
|
} from "@react-navigation/native";
|
||||||
import { useCallback, useEffect, useState } from "react";
|
import { useCallback, useEffect, useState } from "react";
|
||||||
import { ScrollView, StyleSheet, View } from "react-native";
|
import { Pressable, StyleSheet, View } from "react-native";
|
||||||
import { Button, IconButton, Text } from "react-native-paper";
|
import {
|
||||||
import { MARGIN, PADDING } from "./constants";
|
Button,
|
||||||
import { planRepo, setRepo } from "./db";
|
IconButton,
|
||||||
import { defaultSet } from "./gym-set";
|
Switch as PaperSwitch,
|
||||||
import StackHeader from "./StackHeader";
|
Text,
|
||||||
import Switch from "./Switch";
|
} from "react-native-paper";
|
||||||
import { DAYS } from "./days";
|
import ReorderableList, {
|
||||||
|
ReorderableListRenderItemInfo,
|
||||||
|
} from "react-native-reorderable-list";
|
||||||
import AppInput from "./AppInput";
|
import AppInput from "./AppInput";
|
||||||
import { StackParams } from "./AppStack";
|
import { StackParams } from "./AppStack";
|
||||||
|
import StackHeader from "./StackHeader";
|
||||||
|
import Switch from "./Switch";
|
||||||
|
import { MARGIN, PADDING } from "./constants";
|
||||||
|
import { DAYS } from "./days";
|
||||||
|
import { planRepo, setRepo } from "./db";
|
||||||
import { DrawerParams } from "./drawer-param-list";
|
import { DrawerParams } from "./drawer-param-list";
|
||||||
|
import { defaultSet } from "./gym-set";
|
||||||
|
|
||||||
export default function EditPlan() {
|
export default function EditPlan() {
|
||||||
const { params } = useRoute<RouteProp<StackParams, "EditPlan">>();
|
const { params } = useRoute<RouteProp<StackParams, "EditPlan">>();
|
||||||
|
@ -41,8 +49,9 @@ export default function EditPlan() {
|
||||||
.orderBy("name")
|
.orderBy("name")
|
||||||
.getRawMany()
|
.getRawMany()
|
||||||
.then((values) => {
|
.then((values) => {
|
||||||
console.log(EditPlan.name, { values });
|
const newNames = values.map((value) => value.name);
|
||||||
setNames(values.map((value) => value.name));
|
console.log(EditPlan.name, { newNames });
|
||||||
|
setNames(newNames);
|
||||||
});
|
});
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
@ -81,6 +90,43 @@ export default function EditPlan() {
|
||||||
[setDays, days]
|
[setDays, days]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const renderDay = (day: string) => (
|
||||||
|
<Switch
|
||||||
|
key={day}
|
||||||
|
onChange={(value) => toggleDay(value, day)}
|
||||||
|
value={days.includes(day)}
|
||||||
|
title={day}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
|
||||||
|
const renderWorkout = ({
|
||||||
|
item,
|
||||||
|
drag,
|
||||||
|
}: ReorderableListRenderItemInfo<string>) => (
|
||||||
|
<Pressable
|
||||||
|
onLongPress={drag}
|
||||||
|
onPress={() => toggleWorkout(!workouts.includes(item), item)}
|
||||||
|
style={{ flexDirection: "row", alignItems: "center" }}
|
||||||
|
>
|
||||||
|
<PaperSwitch
|
||||||
|
value={workouts.includes(item)}
|
||||||
|
style={{ marginRight: MARGIN }}
|
||||||
|
onValueChange={(value) => toggleWorkout(value, item)}
|
||||||
|
/>
|
||||||
|
<Text>{item}</Text>
|
||||||
|
</Pressable>
|
||||||
|
);
|
||||||
|
|
||||||
|
const reorderWorkout = (from: number, to: number) => {
|
||||||
|
const newNames = [...names];
|
||||||
|
const copy = newNames[from];
|
||||||
|
newNames[from] = newNames[to];
|
||||||
|
newNames[to] = copy;
|
||||||
|
const newWorkouts = newNames.filter((name) => workouts.includes(name));
|
||||||
|
console.log({ newWorkouts });
|
||||||
|
setWorkouts(newWorkouts);
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<StackHeader
|
<StackHeader
|
||||||
|
@ -106,37 +152,35 @@ export default function EditPlan() {
|
||||||
)}
|
)}
|
||||||
</StackHeader>
|
</StackHeader>
|
||||||
<View style={{ padding: PADDING, flex: 1 }}>
|
<View style={{ padding: PADDING, flex: 1 }}>
|
||||||
<ScrollView style={{ flex: 1 }}>
|
<AppInput
|
||||||
<AppInput
|
label="Title"
|
||||||
label="Title"
|
value={title}
|
||||||
value={title}
|
onChangeText={(value) => setTitle(value)}
|
||||||
onChangeText={(value) => setTitle(value)}
|
/>
|
||||||
|
|
||||||
|
<Text style={styles.title}>Days</Text>
|
||||||
|
{DAYS.map((day) => renderDay(day))}
|
||||||
|
|
||||||
|
<Text style={[styles.title, { marginTop: MARGIN }]}>Workouts</Text>
|
||||||
|
{names.length === 0 ? (
|
||||||
|
<View>
|
||||||
|
<Text>No workouts found.</Text>
|
||||||
|
</View>
|
||||||
|
) : (
|
||||||
|
<ReorderableList
|
||||||
|
data={names}
|
||||||
|
onReorder={({ fromIndex, toIndex }) =>
|
||||||
|
reorderWorkout(fromIndex, toIndex)
|
||||||
|
}
|
||||||
|
renderItem={renderWorkout}
|
||||||
|
keyExtractor={(item) => item}
|
||||||
|
dragScale={1.025}
|
||||||
|
style={{
|
||||||
|
flex: 1,
|
||||||
|
}}
|
||||||
|
containerStyle={{ flex: 1 }}
|
||||||
/>
|
/>
|
||||||
<Text style={styles.title}>Days</Text>
|
)}
|
||||||
{DAYS.map((day) => (
|
|
||||||
<Switch
|
|
||||||
key={day}
|
|
||||||
onChange={(value) => toggleDay(value, day)}
|
|
||||||
value={days.includes(day)}
|
|
||||||
title={day}
|
|
||||||
/>
|
|
||||||
))}
|
|
||||||
<Text style={[styles.title, { marginTop: MARGIN }]}>Workouts</Text>
|
|
||||||
{names.length === 0 ? (
|
|
||||||
<View>
|
|
||||||
<Text>No workouts found.</Text>
|
|
||||||
</View>
|
|
||||||
) : (
|
|
||||||
names.map((name) => (
|
|
||||||
<Switch
|
|
||||||
key={name}
|
|
||||||
onChange={(value) => toggleWorkout(value, name)}
|
|
||||||
value={workouts.includes(name)}
|
|
||||||
title={name}
|
|
||||||
/>
|
|
||||||
))
|
|
||||||
)}
|
|
||||||
</ScrollView>
|
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
disabled={workouts.length === 0 && days.length === 0}
|
disabled={workouts.length === 0 && days.length === 0}
|
||||||
|
|
|
@ -85,8 +85,8 @@ android {
|
||||||
applicationId "com.massive"
|
applicationId "com.massive"
|
||||||
minSdkVersion rootProject.ext.minSdkVersion
|
minSdkVersion rootProject.ext.minSdkVersion
|
||||||
targetSdkVersion rootProject.ext.targetSdkVersion
|
targetSdkVersion rootProject.ext.targetSdkVersion
|
||||||
versionCode 36195
|
versionCode 36196
|
||||||
versionName "1.169"
|
versionName "1.170"
|
||||||
}
|
}
|
||||||
signingConfigs {
|
signingConfigs {
|
||||||
release {
|
release {
|
||||||
|
|
29
package-lock.json
generated
29
package-lock.json
generated
|
@ -1,12 +1,12 @@
|
||||||
{
|
{
|
||||||
"name": "massive",
|
"name": "massive",
|
||||||
"version": "1.164",
|
"version": "1.169",
|
||||||
"lockfileVersion": 3,
|
"lockfileVersion": 3,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
"name": "massive",
|
"name": "massive",
|
||||||
"version": "1.164",
|
"version": "1.169",
|
||||||
"license": "GPL-3.0-only",
|
"license": "GPL-3.0-only",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/plugin-proposal-class-properties": "^7.18.6",
|
"@babel/plugin-proposal-class-properties": "^7.18.6",
|
||||||
|
@ -38,6 +38,7 @@
|
||||||
"react-native-pager-view": "^6.2.0",
|
"react-native-pager-view": "^6.2.0",
|
||||||
"react-native-paper": "^5.9.1",
|
"react-native-paper": "^5.9.1",
|
||||||
"react-native-reanimated": "^3.3.0",
|
"react-native-reanimated": "^3.3.0",
|
||||||
|
"react-native-reorderable-list": "^0.4.0",
|
||||||
"react-native-safe-area-context": "^4.7.1",
|
"react-native-safe-area-context": "^4.7.1",
|
||||||
"react-native-screens": "^3.22.1",
|
"react-native-screens": "^3.22.1",
|
||||||
"react-native-share": "^9.2.3",
|
"react-native-share": "^9.2.3",
|
||||||
|
@ -3027,6 +3028,11 @@
|
||||||
"react-native-screens": ">= 3.0.0"
|
"react-native-screens": ">= 3.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/@seznam/compose-react-refs": {
|
||||||
|
"version": "1.0.6",
|
||||||
|
"resolved": "https://registry.npmjs.org/@seznam/compose-react-refs/-/compose-react-refs-1.0.6.tgz",
|
||||||
|
"integrity": "sha512-izzOXQfeQLonzrIQb8u6LQ8dk+ymz3WXTIXjvOlTXHq6sbzROg3NWU+9TTAOpEoK9Bth24/6F/XrfHJ5yR5n6Q=="
|
||||||
|
},
|
||||||
"node_modules/@sideway/address": {
|
"node_modules/@sideway/address": {
|
||||||
"version": "4.1.4",
|
"version": "4.1.4",
|
||||||
"license": "BSD-3-Clause",
|
"license": "BSD-3-Clause",
|
||||||
|
@ -6183,6 +6189,11 @@
|
||||||
"version": "2.0.6",
|
"version": "2.0.6",
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/fast-memoize": {
|
||||||
|
"version": "2.5.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.5.2.tgz",
|
||||||
|
"integrity": "sha512-Ue0LwpDYErFbmNnZSF0UH6eImUwDmogUO1jyE+JbN2gsQz/jICm1Ve7t9QT0rNSsfJt+Hs4/S3GnsDVjL4HVrw=="
|
||||||
|
},
|
||||||
"node_modules/fast-xml-parser": {
|
"node_modules/fast-xml-parser": {
|
||||||
"version": "4.2.5",
|
"version": "4.2.5",
|
||||||
"funding": [
|
"funding": [
|
||||||
|
@ -9909,6 +9920,20 @@
|
||||||
"version": "2.0.0",
|
"version": "2.0.0",
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/react-native-reorderable-list": {
|
||||||
|
"version": "0.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-native-reorderable-list/-/react-native-reorderable-list-0.4.0.tgz",
|
||||||
|
"integrity": "sha512-XC0BpYFNZcTgfO6xAHvB2KefdiFZEp1WOFjZRR9Du9YX5NQtZg4DUKjtXWNgwnoB9SCQh04sOWxRf3rnAXpDww==",
|
||||||
|
"dependencies": {
|
||||||
|
"@seznam/compose-react-refs": "^1.0.6",
|
||||||
|
"fast-memoize": "^2.5.2"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react-native": ">=0.62.0",
|
||||||
|
"react-native-gesture-handler": ">=1.10.0",
|
||||||
|
"react-native-reanimated": ">=2.2.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/react-native-safe-area-context": {
|
"node_modules/react-native-safe-area-context": {
|
||||||
"version": "4.7.1",
|
"version": "4.7.1",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "massive",
|
"name": "massive",
|
||||||
"version": "1.169",
|
"version": "1.170",
|
||||||
"private": true,
|
"private": true,
|
||||||
"license": "GPL-3.0-only",
|
"license": "GPL-3.0-only",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
@ -41,6 +41,7 @@
|
||||||
"react-native-pager-view": "^6.2.0",
|
"react-native-pager-view": "^6.2.0",
|
||||||
"react-native-paper": "^5.9.1",
|
"react-native-paper": "^5.9.1",
|
||||||
"react-native-reanimated": "^3.3.0",
|
"react-native-reanimated": "^3.3.0",
|
||||||
|
"react-native-reorderable-list": "^0.4.0",
|
||||||
"react-native-safe-area-context": "^4.7.1",
|
"react-native-safe-area-context": "^4.7.1",
|
||||||
"react-native-screens": "^3.22.1",
|
"react-native-screens": "^3.22.1",
|
||||||
"react-native-share": "^9.2.3",
|
"react-native-share": "^9.2.3",
|
||||||
|
|
Loading…
Reference in New Issue
Block a user