Skip to content

Commit 3d84812

Browse files
Merge pull request #286 from OpenDTU-App/plenty-of-fixes
Add plenty of fixes
2 parents b4305df + fa71dbe commit 3d84812

File tree

12 files changed

+347
-160
lines changed

12 files changed

+347
-160
lines changed

.github/workflows/testing.yml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,9 @@ jobs:
3434
run: |
3535
yarn install --immutable --check-cache
3636
37+
- name: Run Typecheck
38+
run: yarn typecheck
39+
3740
- name: Run ESLint
3841
continue-on-error: true
3942
id: eslint
66.9 KB
Loading
Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,8 @@
11
<?xml version="1.0" encoding="utf-8" ?>
2-
<RelativeLayout
2+
<LinearLayout
33
xmlns:android="http://schemas.android.com/apk/res/android"
4-
android:orientation="vertical" android:layout_width="match_parent"
4+
android:layout_width="match_parent"
55
android:layout_height="match_parent"
6+
android:background="@drawable/launch_screen"
67
>
7-
<ImageView
8-
android:layout_width="match_parent"
9-
android:layout_height="match_parent"
10-
android:src="@drawable/launch_screen"
11-
android:scaleType="centerCrop"
12-
/>
13-
</RelativeLayout>
8+
</LinearLayout>

android/app/src/main/res/values/styles.xml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
55
<!-- Customize your theme here. -->
66
<item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
7+
<item name="android:windowIsTranslucent">true</item>
78
</style>
89

910
</resources>

licenses.json

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,10 @@
11
{
2+
"@devvie/[email protected]": {
3+
"licenses": "MIT",
4+
"repository": "https://github.com/stanleyugwu/react-native-bottom-sheet",
5+
"licenseUrl": "https://github.com/stanleyugwu/react-native-bottom-sheet/raw/master/LICENSE",
6+
"parents": "opendtu-react-native"
7+
},
28
"@octokit/[email protected]": {
39
"licenses": "MIT",
410
"repository": "github:octokit/rest.js",
@@ -167,12 +173,6 @@
167173
"licenseUrl": "https://github.com/i18next/react-i18next/raw/master/LICENSE",
168174
"parents": "opendtu-react-native"
169175
},
170-
171-
"licenses": "ISC",
172-
"repository": "https://github.com/AtharvaDeolalikar/react-native-animated-bottom-drawer",
173-
"licenseUrl": "https://github.com/AtharvaDeolalikar/react-native-animated-bottom-drawer",
174-
"parents": "opendtu-react-native"
175-
},
176176
177177
"licenses": "MIT",
178178
"repository": "https://github.com/wuxudong/react-native-charts-wrapper",

package.json

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@
3232
"pod-install": "cd ios && pod install"
3333
},
3434
"dependencies": {
35+
"@devvie/bottom-sheet": "^0.4.3",
3536
"@octokit/rest": "^21.0.2",
3637
"@os-team/i18next-react-native-language-detector": "^1.1.5",
3738
"@pchmn/expo-material3-theme": "^1.3.2",
@@ -62,7 +63,6 @@
6263
"react": "18.3.1",
6364
"react-i18next": "^15.2.0",
6465
"react-native": "0.76.5",
65-
"react-native-animated-bottom-drawer": "^0.0.23",
6666
"react-native-charts-wrapper": "^0.6.0",
6767
"react-native-config": "^1.5.3",
6868
"react-native-fast-image": "^8.6.3",
@@ -112,6 +112,7 @@
112112
"@react-native/typescript-config": "0.76.5",
113113
"@testing-library/react-native": "^12.9.0",
114114
"@trivago/prettier-plugin-sort-imports": "^5.2.0",
115+
"@types/color": "^4.2.0",
115116
"@types/jest": "^29.5.14",
116117
"@types/markdown-it": "^14.1.2",
117118
"@types/npm-license-crawler": "^0.2.3",
@@ -121,9 +122,11 @@
121122
"@types/react-test-renderer": "^18.3.0",
122123
"@types/styled-components": "^5.1.34",
123124
"@types/uuid": "^10.0.0",
125+
"@typescript-eslint/eslint-plugin": "^7.18.1-alpha.3",
126+
"@typescript-eslint/parser": "^7.18.1-alpha.3",
124127
"babel-jest": "^29.7.0",
125128
"babel-plugin-module-resolver": "^5.0.2",
126-
"eslint": "^8.57.0",
129+
"eslint": "^8",
127130
"eslint-import-resolver-typescript": "^3.7.0",
128131
"eslint-plugin-import": "^2.31.0",
129132
"eslint-plugin-no-relative-import-paths": "^1.5.5",
@@ -136,7 +139,7 @@
136139
"react-native-version": "4.0.0",
137140
"react-test-renderer": "18.3.1",
138141
"ts-jest": "^29.2.5",
139-
"typescript": "5.6.3"
142+
"typescript": "^5 <5.6.0"
140143
},
141144
"engines": {
142145
"node": ">=18"
Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
diff --git a/node_modules/react-native-paper-dates/src/Date/Swiper.tsx b/node_modules/react-native-paper-dates/src/Date/Swiper.tsx
2+
index 08c47c1..bdd49b5 100644
3+
--- a/node_modules/react-native-paper-dates/src/Date/Swiper.tsx
4+
+++ b/node_modules/react-native-paper-dates/src/Date/Swiper.tsx
5+
@@ -21,6 +21,7 @@ import React, {
6+
import { sharedStyles } from '../shared/styles'
7+
8+
const useIsomorphicLayoutEffect =
9+
+// @ts-ignore
10+
typeof window !== 'undefined' ? useLayoutEffect : useEffect
11+
12+
function Swiper({
13+
@@ -120,6 +121,7 @@ function VerticalScroller({
14+
const top =
15+
getVerticalMonthsOffset(idx.current, startWeekOnMonday) - montHeaderHeight
16+
17+
+ // @ts-ignore
18+
element.scrollTo({
19+
top,
20+
})
21+
@@ -129,6 +131,7 @@ function VerticalScroller({
22+
23+
const onScroll = useCallback(
24+
(e: UIEvent) => {
25+
+ // @ts-ignore
26+
const top = e.currentTarget?.scrollTop
27+
if (top === 0) {
28+
return
29+
@@ -206,6 +209,7 @@ export function useDebouncedCallback(callback: any): any {
30+
return () => {
31+
mounted.current = false
32+
if (timerId.current) {
33+
+ // @ts-ignore
34+
window.cancelAnimationFrame(timerId.current)
35+
}
36+
}
37+
@@ -214,8 +218,10 @@ export function useDebouncedCallback(callback: any): any {
38+
return useCallback(
39+
(args: any) => {
40+
if (timerId.current) {
41+
+ // @ts-ignore
42+
window.cancelAnimationFrame(timerId.current)
43+
}
44+
+ // @ts-ignore
45+
timerId.current = window.requestAnimationFrame(function () {
46+
if (mounted.current) {
47+
latest.current(args)

src/components/modals/ChangeBooleanValueModal.tsx

Lines changed: 20 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,25 @@
11
import type { FC } from 'react';
22
import { useEffect, useRef, useState } from 'react';
33
import { useTranslation } from 'react-i18next';
4-
import type { BottomDrawerMethods } from 'react-native-animated-bottom-drawer';
5-
import BottomDrawer from 'react-native-animated-bottom-drawer';
64
import type { SwitchProps } from 'react-native-paper';
75
import { Button, Switch, Text, useTheme } from 'react-native-paper';
86

97
import { View } from 'react-native';
108

9+
import useOrientation, { Orientation } from '@/hooks/useOrientation';
10+
1111
import { spacing } from '@/constants';
1212

13+
import type { BottomSheetMethods } from '@devvie/bottom-sheet';
14+
import BottomSheet from '@devvie/bottom-sheet';
15+
1316
export interface ChangeBooleanValueModalProps {
1417
isOpen?: boolean;
1518
onClose?: () => void;
1619
defaultValue?: boolean;
1720
onChange?: (value: boolean) => void;
1821
title?: string;
1922
description?: string;
20-
extraHeight?: number;
2123
inputProps?: Omit<SwitchProps, 'value' | 'onValueChange'>;
2224
}
2325

@@ -29,14 +31,11 @@ const ChangeBooleanValueModal: FC<ChangeBooleanValueModalProps> = ({
2931
onChange: onSave,
3032
onClose,
3133
inputProps,
32-
extraHeight,
3334
}) => {
3435
const theme = useTheme();
35-
const drawerRef = useRef<BottomDrawerMethods>(null);
36+
const drawerRef = useRef<BottomSheetMethods>(null);
3637
const { t } = useTranslation();
3738

38-
const [initialHeight, setInitialHeight] = useState<number>(0);
39-
4039
const [value, setValue] = useState<boolean>(defaultValue ?? false);
4140
const [wasModified, setWasModified] = useState<boolean>(false);
4241

@@ -69,44 +68,27 @@ const ChangeBooleanValueModal: FC<ChangeBooleanValueModalProps> = ({
6968
}
7069
}, [defaultValue, wasModified]);
7170

71+
const { orientation } = useOrientation();
72+
7273
return (
73-
<BottomDrawer
74+
<BottomSheet
7475
ref={drawerRef}
75-
overDrag
76-
customStyles={{
77-
container: {
78-
backgroundColor: theme.colors.surface,
79-
},
80-
handleContainer: {
81-
backgroundColor: theme.colors.surfaceVariant,
82-
minHeight: 35,
83-
borderTopLeftRadius: 20,
84-
borderTopRightRadius: 20,
85-
},
86-
handle: {
87-
backgroundColor: theme.colors.surfaceDisabled,
88-
width: 40,
89-
height: 5,
90-
borderRadius: 5,
91-
},
92-
}}
93-
initialHeight={initialHeight}
9476
onClose={handleCancel}
77+
style={{
78+
borderTopLeftRadius: 20,
79+
borderTopRightRadius: 20,
80+
backgroundColor: theme.colors.surface,
81+
left: orientation === Orientation.LANDSCAPE ? '25%' : 0,
82+
right: orientation === Orientation.LANDSCAPE ? '25%' : 0,
83+
width: orientation === Orientation.LANDSCAPE ? '50%' : '100%',
84+
}}
85+
openDuration={450}
86+
closeDuration={300}
9587
>
9688
<View
9789
style={{
9890
paddingHorizontal: spacing * 2,
9991
paddingTop: spacing * 2,
100-
paddingBottom: spacing * 3,
101-
}}
102-
onLayout={e => {
103-
const { height, y } = e.nativeEvent.layout;
104-
const heightValue = height + y + (extraHeight ?? 0);
105-
106-
drawerRef.current?.snapToPosition(heightValue, {
107-
resetLastPosition: false,
108-
});
109-
setInitialHeight(heightValue);
11092
}}
11193
>
11294
<View
@@ -148,7 +130,7 @@ const ChangeBooleanValueModal: FC<ChangeBooleanValueModalProps> = ({
148130
</Button>
149131
</View>
150132
</View>
151-
</BottomDrawer>
133+
</BottomSheet>
152134
);
153135
};
154136

src/components/modals/ChangeEnumValueModal.tsx

Lines changed: 20 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,18 @@
11
import type { FC } from 'react';
22
import { useEffect, useRef, useState } from 'react';
33
import { useTranslation } from 'react-i18next';
4-
import type { BottomDrawerMethods } from 'react-native-animated-bottom-drawer';
5-
import BottomDrawer from 'react-native-animated-bottom-drawer';
64
import { Box } from 'react-native-flex-layout';
75
import { Button, RadioButton, Text, useTheme } from 'react-native-paper';
86

97
import { ScrollView, View } from 'react-native';
108

9+
import useOrientation, { Orientation } from '@/hooks/useOrientation';
10+
1111
import { spacing } from '@/constants';
1212

13+
import type { BottomSheetMethods } from '@devvie/bottom-sheet';
14+
import BottomSheet from '@devvie/bottom-sheet';
15+
1316
export interface ChangeEnumValueModalProps {
1417
isOpen?: boolean;
1518
onClose?: () => void;
@@ -18,7 +21,6 @@ export interface ChangeEnumValueModalProps {
1821
possibleValues: PossibleEnumValues;
1922
title?: string;
2023
description?: string;
21-
extraHeight?: number;
2224
}
2325

2426
export type PossibleEnumValues = { label: string; value: string }[];
@@ -30,15 +32,12 @@ const ChangeEnumValueModal: FC<ChangeEnumValueModalProps> = ({
3032
defaultValue,
3133
onChange: onSave,
3234
onClose,
33-
extraHeight,
3435
possibleValues,
3536
}) => {
3637
const theme = useTheme();
37-
const drawerRef = useRef<BottomDrawerMethods>(null);
38+
const drawerRef = useRef<BottomSheetMethods>(null);
3839
const { t } = useTranslation();
3940

40-
const [initialHeight, setInitialHeight] = useState<number>(0);
41-
4241
const [value, setValue] = useState<string>(defaultValue ?? '');
4342
const [wasModified, setWasModified] = useState<boolean>(false);
4443

@@ -71,44 +70,27 @@ const ChangeEnumValueModal: FC<ChangeEnumValueModalProps> = ({
7170
}
7271
}, [defaultValue, wasModified]);
7372

73+
const { orientation } = useOrientation();
74+
7475
return (
75-
<BottomDrawer
76+
<BottomSheet
7677
ref={drawerRef}
77-
overDrag
78-
customStyles={{
79-
container: {
80-
backgroundColor: theme.colors.surface,
81-
},
82-
handleContainer: {
83-
backgroundColor: theme.colors.surfaceVariant,
84-
minHeight: 35,
85-
borderTopLeftRadius: 20,
86-
borderTopRightRadius: 20,
87-
},
88-
handle: {
89-
backgroundColor: theme.colors.surfaceDisabled,
90-
width: 40,
91-
height: 5,
92-
borderRadius: 5,
93-
},
94-
}}
95-
initialHeight={initialHeight}
9678
onClose={handleCancel}
79+
style={{
80+
borderTopLeftRadius: 20,
81+
borderTopRightRadius: 20,
82+
backgroundColor: theme.colors.surface,
83+
left: orientation === Orientation.LANDSCAPE ? '25%' : 0,
84+
right: orientation === Orientation.LANDSCAPE ? '25%' : 0,
85+
width: orientation === Orientation.LANDSCAPE ? '50%' : '100%',
86+
}}
87+
openDuration={450}
88+
closeDuration={300}
9789
>
9890
<View
9991
style={{
10092
paddingHorizontal: spacing * 2,
10193
paddingTop: spacing * 2,
102-
paddingBottom: spacing * 3,
103-
}}
104-
onLayout={e => {
105-
const { height, y } = e.nativeEvent.layout;
106-
const heightValue = height + y + (extraHeight ?? 0);
107-
108-
drawerRef.current?.snapToPosition(heightValue, {
109-
resetLastPosition: false,
110-
});
111-
setInitialHeight(heightValue);
11294
}}
11395
>
11496
<View
@@ -167,7 +149,7 @@ const ChangeEnumValueModal: FC<ChangeEnumValueModalProps> = ({
167149
</Button>
168150
</View>
169151
</View>
170-
</BottomDrawer>
152+
</BottomSheet>
171153
);
172154
};
173155

0 commit comments

Comments
 (0)