Skip to content

Commit

Permalink
ui changes
Browse files Browse the repository at this point in the history
  • Loading branch information
ragsav committed Apr 23, 2023
1 parent fa4f768 commit c928456
Show file tree
Hide file tree
Showing 23 changed files with 674 additions and 281 deletions.
2 changes: 2 additions & 0 deletions constants.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ export const CONSTANTS = Object.freeze({
LABEL_DRAWER: 'LABEL_DRAWER',
ADD_LABEL: 'ADD_LABEL',
EDIT_LABEL: 'EDIT_LABEL',
UNLABELED_NOTES: 'UNLABELED_NOTES',

ADD_NOTE: 'ADD_NOTE',
EDIT_NOTE: 'EDIT_NOTE',
Expand Down Expand Up @@ -119,5 +120,6 @@ export const CONSTANTS = Object.freeze({

NOTE_SORT_ORDER: 'NOTE_SORT_ORDER',
NOTE_SORT_PROPERTY: 'NOTE_SORT_PROPERTY',
TASK_LIST_DETAILED_VIEW: 'TASK_LIST_DETAILED_VIEW',
},
});
5 changes: 3 additions & 2 deletions js/components/DescriptionBottomSheet.js
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,6 @@ export const DescriptionBottomSheet = ({
{...props}
appearsOnIndex={0}
disappearsOnIndex={-1}
opacity={1}
/>
),
[],
Expand All @@ -107,8 +106,9 @@ export const DescriptionBottomSheet = ({
snapPoints={snapPoints}
enablePanDownToClose={false}
handleStyle={{display: 'none'}}
onClose={_onDestroy}
backgroundStyle={{backgroundColor: theme?.colors.surface}}
backdropComponent={_renderBackdrop}
onClose={() => setVisible(false)}
onChange={_handleSheetChange}>
<Appbar.Header>
<Appbar.Action icon={'close'} onPress={_handleCloseFilterSheet} />
Expand All @@ -130,6 +130,7 @@ export const DescriptionBottomSheet = ({
}}
onChangeText={_handleChangeLocalDescription}
value={localDescription}
multiline={true}
/>
</BottomSheet>
);
Expand Down
147 changes: 82 additions & 65 deletions js/components/DrawerBasedNavigator.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,10 @@ import {Divider, useTheme} from 'react-native-paper';
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
import {CONSTANTS} from '../../constants';
import {connect} from 'react-redux';
import CreateNewLabelScreen from '../screens/CreateNewLabelScreen';
import UnlabeledNotesScreen from '../screens/UnlabeledNotesScreen';
import ArchivedNotesScreen from '../screens/ArchivedNotesScreen';
import PinScreen from '../screens/PinScreen';

const Drawer = createDrawerNavigator();

Expand Down Expand Up @@ -95,49 +99,6 @@ export const CustomDrawer = props => {
/>
)}

{props?.quickListSettings?.myDay && (
<DrawerItem
label="Pinned Notes"
style={{borderRadius: 25, paddingHorizontal: 0}}
labelStyle={{
fontSize: 15,
borderRadius: 20,
marginLeft: -25,
color: theme?.colors.secondary,
}}
onPress={() => {
props.navigation.navigate(CONSTANTS.ROUTES.PINNED_NOTES);
}}
icon={() => (
<MaterialCommunityIcons
name={'pin'}
size={22}
color={theme?.colors.primary}
/>
)}
/>
)}
<DrawerItem
label="Archived Notes"
style={{borderRadius: 25, paddingHorizontal: 0}}
labelStyle={{
fontSize: 15,
borderRadius: 20,
marginLeft: -25,
color: theme?.colors.secondary,
}}
onPress={() => {
props.navigation.navigate(CONSTANTS.ROUTES.ARCHIVED_NOTES);
}}
icon={() => (
<MaterialCommunityIcons
name={'package-down'}
size={22}
color={theme?.colors.primary}
/>
)}
/>

{props?.quickListSettings?.all && (
<DrawerItem
label="All tasks"
Expand Down Expand Up @@ -227,26 +188,6 @@ export const CustomDrawer = props => {
/>
)}

<DrawerItem
style={{borderRadius: 25, paddingHorizontal: 0}}
labelStyle={{
fontSize: 15,
borderRadius: 20,
marginLeft: -25,
color: theme?.colors.secondary,
}}
label="Add label"
onPress={() => {
props.navigation.navigate(CONSTANTS.ROUTES.ADD_LABEL);
}}
icon={() => (
<MaterialCommunityIcons
name={'plus'}
size={22}
color={theme?.colors.primary}
/>
)}
/>
<Divider />

<DrawerItem
Expand Down Expand Up @@ -274,7 +215,12 @@ export const CustomDrawer = props => {
);
};

const DrawerBasedNavigation = ({labels, quickListSettings}) => {
const DrawerBasedNavigation = ({
labels,
quickListSettings,
isSettingLabelInDB,
setupLabelInDBSuccess,
}) => {
const theme = useTheme();

return (
Expand Down Expand Up @@ -302,10 +248,18 @@ const DrawerBasedNavigation = ({labels, quickListSettings}) => {
},
}}
drawerContent={props => (
<CustomDrawer {...{...props, quickListSettings}} />
<CustomDrawer
{...{
...props,
quickListSettings,
isSettingLabelInDB,
setupLabelInDBSuccess,
}}
/>
)}>
{labels &&
Array.isArray(labels) &&
labels.length > 0 &&
labels.map((label, index) => {
return (
<Drawer.Screen
Expand All @@ -326,6 +280,67 @@ const DrawerBasedNavigation = ({labels, quickListSettings}) => {
/>
);
})}

<Drawer.Screen
key={`labels-drawer-${CONSTANTS.ROUTES.ADD_LABEL}`}
options={{
drawerLabel: 'Add label',
drawerIcon: ({color}) => (
<MaterialCommunityIcons
name={'plus'}
size={22}
color={theme?.colors.primary}
/>
),
}}
name={`${CONSTANTS.ROUTES.ADD_LABEL}`}
component={CreateNewLabelScreen}
/>
<Drawer.Screen
key={`labels-drawer-${CONSTANTS.ROUTES.UNLABELED_NOTES}`}
options={{
drawerLabel: 'Unlabeled notes',
drawerIcon: ({color}) => (
<MaterialCommunityIcons
name={'label-off'}
size={22}
color={theme?.colors.primary}
/>
),
}}
name={`${CONSTANTS.ROUTES.UNLABELED_NOTES}`}
component={UnlabeledNotesScreen}
/>
<Drawer.Screen
key={`labels-drawer-${CONSTANTS.ROUTES.PINNED_NOTES}`}
options={{
drawerLabel: 'Pinned notes',
drawerIcon: ({color}) => (
<MaterialCommunityIcons
name={'pin'}
size={22}
color={theme?.colors.primary}
/>
),
}}
name={`${CONSTANTS.ROUTES.PINNED_NOTES}`}
component={PinScreen}
/>
<Drawer.Screen
key={`labels-drawer-${CONSTANTS.ROUTES.ARCHIVED_NOTES}`}
options={{
drawerLabel: 'Archived notes',
drawerIcon: ({color}) => (
<MaterialCommunityIcons
name={'package-down'}
size={22}
color={theme?.colors.primary}
/>
),
}}
name={`${CONSTANTS.ROUTES.ARCHIVED_NOTES}`}
component={ArchivedNotesScreen}
/>
</Drawer.Navigator>
);
};
Expand All @@ -340,6 +355,8 @@ const EnhancedDrawerBasedNavigation = enhanceDrawerBasedNavigation(
const mapStateToProps = state => {
return {
quickListSettings: state.settings.quickListSettings,
isSettingLabelInDB: state.label.isSettingLabelInDB,
setupLabelInDBSuccess: state.label.setupLabelInDBSuccess,
};
};

Expand Down
1 change: 1 addition & 0 deletions js/components/ImageAttachmentsGallery.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ export const ImageAttachmentGallery = ({
<Pressable
style={{position: 'relative', marginRight: 12}}
onPress={() =>
setImageToView &&
setImageToView({
images: URIs?.map(uri => {
return {uri};
Expand Down
33 changes: 26 additions & 7 deletions js/components/NoteItem.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import withObservables from '@nozbe/with-observables';
import {useNavigation} from '@react-navigation/native';
import React from 'react';
import {View} from 'react-native';
// import ImageView from 'react-native-image-viewing';
import {
Button,
Divider,
Expand Down Expand Up @@ -96,7 +97,7 @@ const NoteItem = ({note, tasks, tasksCount, handleDeleteNote, dispatch}) => {
flexDirection: 'row',
justifyContent: 'flex-start',
alignItems: 'flex-start',
flex: 4,
flex: 1,
}}>
<Text
style={{fontSize: 18, fontWeight: '700'}}
Expand All @@ -112,15 +113,33 @@ const NoteItem = ({note, tasks, tasksCount, handleDeleteNote, dispatch}) => {
return <Text key={`note-tasks-${task.id}`}>{task.title}</Text>;
})}

<Text
<View
style={{
textAlign: 'right',
flex: 1,
fontSize: 12,
display: 'flex',
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
width: '100%',
marginTop: 10,
}}>
{String(tasksCount) + ' tasks'}
</Text>
<Text
style={{
textAlign: 'left',
flex: 1,
fontSize: 12,

textAlignVertical: 'center',
}}>
{String(tasksCount) + ' tasks'}
</Text>
{Boolean(note.isPinned) && (
<MaterialCommunityIcons
name={'pin'}
size={14}
color={theme?.colors.primary}
/>
)}
</View>
</View>
</TouchableRipple>
</View>
Expand Down
15 changes: 2 additions & 13 deletions js/components/Router.js
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ import Settings from '../screens/Settings';
import TaskScreen from '../screens/TaskScreen';
import EnhancedDrawerBasedNavigation from './DrawerBasedNavigator';
import PermissionsProvider from './PermissionsProvider';
import UnlabeledNotesScreen from '../screens/UnlabeledNotesScreen';
// const Stack = createStackNavigator();
const Stack = createSharedElementStackNavigator();
const opacityTransition = {
Expand Down Expand Up @@ -79,7 +80,7 @@ const Router = ({theme, defaultHomeScreen, dispatch}) => {
<PermissionsProvider>
<PaperProvider theme={theme}>
<StatusBar
barStyle={theme?.statusBarStyle}
barStyle="light-content"
backgroundColor={theme?.colors.surface}
// translucent
/>
Expand Down Expand Up @@ -107,13 +108,6 @@ const Router = ({theme, defaultHomeScreen, dispatch}) => {
headerShown: false,
}}
/>
<Stack.Screen
name={CONSTANTS.ROUTES.PINNED_NOTES}
component={PinScreen}
options={{
headerShown: false,
}}
/>
<Stack.Screen
name={CONSTANTS.ROUTES.ADD_LABEL}
component={CreateNewLabelScreen}
Expand Down Expand Up @@ -188,11 +182,6 @@ const Router = ({theme, defaultHomeScreen, dispatch}) => {
component={DeletedTasksScreen}
options={{headerShown: false}}
/>
<Stack.Screen
name={CONSTANTS.ROUTES.ARCHIVED_NOTES}
component={ArchivedNotesScreen}
options={{headerShown: false}}
/>
<Stack.Screen
name={CONSTANTS.ROUTES.BACKUP}
component={BackupConfigScreen}
Expand Down
Loading

0 comments on commit c928456

Please sign in to comment.