mirror of
https://github.com/streetwriters/notesnook.git
synced 2026-02-24 04:00:59 +01:00
mobile: add remove from notebook with multi-select
This commit is contained in:
committed by
Abdullah Atta
parent
fdeb34ff0a
commit
590f2d80d3
@@ -89,6 +89,7 @@ export const ColorTags = ({ item }) => {
|
||||
flexWrap: "wrap",
|
||||
flexGrow: isTablet ? undefined : 1,
|
||||
paddingHorizontal: 12,
|
||||
paddingRight: 0,
|
||||
alignItems: "center",
|
||||
justifyContent: isTablet ? "center" : "space-between"
|
||||
}}
|
||||
|
||||
@@ -179,6 +179,7 @@ Properties.present = (item, buttons = [], isSheet) => {
|
||||
"lock-unlock",
|
||||
"trash",
|
||||
"remove-from-topic",
|
||||
"remove-from-notebook",
|
||||
"history",
|
||||
"read-only",
|
||||
"reminders",
|
||||
|
||||
@@ -108,7 +108,8 @@ export const Items = ({ item, buttons, close }) => {
|
||||
/>
|
||||
);
|
||||
|
||||
const renderTopBarItem = (item) => {
|
||||
const renderTopBarItem = (item, index) => {
|
||||
const isLast = index === topBarItems.length;
|
||||
return (
|
||||
<PressableButton
|
||||
onPress={item.func}
|
||||
@@ -118,7 +119,7 @@ export const Items = ({ item, buttons, close }) => {
|
||||
alignItems: "center",
|
||||
width: topBarItemWidth,
|
||||
marginBottom: 10,
|
||||
marginRight: 10,
|
||||
marginRight: isLast ? 0 : 10,
|
||||
backgroundColor: "transparent"
|
||||
}}
|
||||
>
|
||||
@@ -200,10 +201,8 @@ export const Items = ({ item, buttons, close }) => {
|
||||
disableVirtualization={true}
|
||||
style={{
|
||||
marginTop: item.type !== "note" ? 10 : 0,
|
||||
paddingTop: 10
|
||||
}}
|
||||
columnWrapperStyle={{
|
||||
justifyContent: "flex-start"
|
||||
paddingTop: 10,
|
||||
marginLeft: 6
|
||||
}}
|
||||
contentContainerStyle={{
|
||||
alignSelf: "center",
|
||||
|
||||
@@ -40,7 +40,9 @@ export const Tags = ({ item, close }) => {
|
||||
flexWrap: "wrap",
|
||||
alignItems: "center",
|
||||
paddingHorizontal: 12,
|
||||
alignSelf: "center"
|
||||
alignSelf: "center",
|
||||
justifyContent: "space-between",
|
||||
width: "100%"
|
||||
}}
|
||||
>
|
||||
<Button
|
||||
@@ -76,8 +78,8 @@ export const TagStrip = ({ item, close }) => {
|
||||
alignItems: "center"
|
||||
}}
|
||||
>
|
||||
{item.tags.map((item) =>
|
||||
item ? <TagItem key={item} tag={item} close={close} /> : null
|
||||
{item.tags.map((tag) =>
|
||||
tag ? <TagItem key={tag} tag={item} close={close} /> : null
|
||||
)}
|
||||
</View>
|
||||
) : null;
|
||||
|
||||
@@ -264,19 +264,29 @@ export const SelectionHeader = React.memo(() => {
|
||||
</>
|
||||
)}
|
||||
|
||||
{screen === "TopicNotes" ? (
|
||||
{screen === "TopicNotes" || screen === "Notebook" ? (
|
||||
<IconButton
|
||||
onPress={async () => {
|
||||
if (selectedItemsList.length > 0) {
|
||||
const currentTopic =
|
||||
const currentScreen =
|
||||
useNavigationStore.getState().currentScreen;
|
||||
await db.notes.removeFromNotebook(
|
||||
{
|
||||
id: currentTopic.notebookId,
|
||||
topic: currentTopic.id
|
||||
},
|
||||
...selectedItemsList.map((item) => item.id)
|
||||
);
|
||||
|
||||
if (screen === "Notebook") {
|
||||
for (const item of selectedItemsList) {
|
||||
await db.relations.unlink(
|
||||
{ type: "notebook", id: currentScreen.id },
|
||||
item
|
||||
);
|
||||
}
|
||||
} else {
|
||||
await db.notes.removeFromNotebook(
|
||||
{
|
||||
id: currentScreen.notebookId,
|
||||
topic: currentScreen.id
|
||||
},
|
||||
...selectedItemsList.map((item) => item.id)
|
||||
);
|
||||
}
|
||||
|
||||
Navigation.queueRoutesForUpdate(
|
||||
"Notes",
|
||||
@@ -293,7 +303,9 @@ export const SelectionHeader = React.memo(() => {
|
||||
customStyle={{
|
||||
marginLeft: 10
|
||||
}}
|
||||
tooltipText="Remove from topic"
|
||||
tooltipText={`Remove from ${
|
||||
screen === "Notebook" ? "notebook" : "topic"
|
||||
}`}
|
||||
tooltipPosition={4}
|
||||
testID="select-minus"
|
||||
color={colors.pri}
|
||||
|
||||
@@ -217,7 +217,7 @@ export class AddNotebookSheet extends React.Component {
|
||||
topics: prevTopics
|
||||
});
|
||||
setTimeout(() => {
|
||||
this.listRef.scrollToEnd({ animated: true });
|
||||
this.listRef.current?.scrollToEnd?.({ animated: true });
|
||||
}, 30);
|
||||
this.currentInputValue = null;
|
||||
} else {
|
||||
@@ -241,7 +241,7 @@ export class AddNotebookSheet extends React.Component {
|
||||
|
||||
if (forward) {
|
||||
setTimeout(() => {
|
||||
this.listRef.scrollToEnd({ animated: true });
|
||||
this.listRef.current?.scrollToEnd?.({ animated: true });
|
||||
}, 30);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -164,8 +164,7 @@ export const TopicsSheet = () => {
|
||||
ref={ref}
|
||||
isModal={false}
|
||||
containerStyle={{
|
||||
height: 530,
|
||||
maxHeight: 800,
|
||||
maxHeight: 600,
|
||||
borderTopRightRadius: 15,
|
||||
borderTopLeftRadius: 15,
|
||||
backgroundColor: colors.bg,
|
||||
@@ -239,7 +238,7 @@ export const TopicsSheet = () => {
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
height: 530,
|
||||
maxHeight: 600,
|
||||
width: "100%"
|
||||
}}
|
||||
>
|
||||
@@ -322,6 +321,18 @@ export const TopicsSheet = () => {
|
||||
}
|
||||
keyExtractor={(item) => item.id}
|
||||
renderItem={renderTopic}
|
||||
ListEmptyComponent={
|
||||
<View
|
||||
style={{
|
||||
flex: 1,
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
height: 300
|
||||
}}
|
||||
>
|
||||
<Paragraph color={colors.icon}>No topics</Paragraph>
|
||||
</View>
|
||||
}
|
||||
ListFooterComponent={<View style={{ height: 50 }} />}
|
||||
/>
|
||||
</SelectionContext.Provider>
|
||||
|
||||
@@ -102,6 +102,15 @@ export const useActions = ({ close = () => null, item }) => {
|
||||
);
|
||||
};
|
||||
|
||||
const isNoteInNotebook = () => {
|
||||
const currentScreen = useNavigationStore.getState().currentScreen;
|
||||
if (item.type !== "note" || currentScreen.name !== "Notebook") return;
|
||||
|
||||
return !!db.relations
|
||||
.to(item, "notebook")
|
||||
.find((notebook) => notebook.id === currentScreen.id);
|
||||
};
|
||||
|
||||
const onUpdate = useCallback(
|
||||
async (type) => {
|
||||
if (type === "unpin") {
|
||||
@@ -506,6 +515,22 @@ export const useActions = ({ close = () => null, item }) => {
|
||||
close();
|
||||
}
|
||||
|
||||
async function removeNoteFromNotebook() {
|
||||
const currentScreen = useNavigationStore.getState().currentScreen;
|
||||
if (currentScreen.name !== "Notebook") return;
|
||||
await db.relations.unlink({ type: "notebook", id: currentScreen.id }, item);
|
||||
Navigation.queueRoutesForUpdate(
|
||||
"TaggedNotes",
|
||||
"ColoredNotes",
|
||||
"TopicNotes",
|
||||
"Favorites",
|
||||
"Notes",
|
||||
"Notebook",
|
||||
"Notebooks"
|
||||
);
|
||||
close();
|
||||
}
|
||||
|
||||
async function deleteTrashItem() {
|
||||
if (!checkNoteSynced()) return;
|
||||
close();
|
||||
@@ -828,6 +853,13 @@ export const useActions = ({ close = () => null, item }) => {
|
||||
icon: "minus-circle-outline",
|
||||
func: removeNoteFromTopic
|
||||
},
|
||||
{
|
||||
id: "remove-from-notebook",
|
||||
title: "Remove from notebook",
|
||||
hidden: !isNoteInNotebook(),
|
||||
icon: "minus-circle-outline",
|
||||
func: removeNoteFromNotebook
|
||||
},
|
||||
{
|
||||
id: "trash",
|
||||
title:
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
"html-to-text": "8.1.0",
|
||||
"phone": "^3.1.14",
|
||||
"qclone": "^1.2.0",
|
||||
"react-native-actions-sheet": "^0.9.0-alpha.6",
|
||||
"react-native-actions-sheet": "^0.9.0-alpha.8",
|
||||
"react-native-check-version": "https://github.com/flexible-agency/react-native-check-version",
|
||||
"react-native-drax": "^0.10.2",
|
||||
"react-native-image-zoom-viewer": "^3.0.1",
|
||||
|
||||
@@ -126,7 +126,7 @@ const Notebook = ({ route, navigation }: NavigationProps<"Notebook">) => {
|
||||
const PLACEHOLDER_DATA = {
|
||||
heading: params.current.item?.title,
|
||||
paragraph: "You have not added any notes yet.",
|
||||
button: "Add first note",
|
||||
button: "Add your first note",
|
||||
action: openEditor,
|
||||
loading: "Loading notebook notes"
|
||||
};
|
||||
|
||||
47
apps/mobile/package-lock.json
generated
47
apps/mobile/package-lock.json
generated
@@ -42,7 +42,7 @@
|
||||
"qclone": "^1.2.0",
|
||||
"react": "18.0.0",
|
||||
"react-native": "0.69.7",
|
||||
"react-native-actions-sheet": "^0.9.0-alpha.6",
|
||||
"react-native-actions-sheet": "^0.9.0-alpha.8",
|
||||
"react-native-check-version": "https://github.com/flexible-agency/react-native-check-version",
|
||||
"react-native-drax": "^0.10.2",
|
||||
"react-native-image-zoom-viewer": "^3.0.1",
|
||||
@@ -17957,31 +17957,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-actions-sheet": {
|
||||
"version": "0.9.0-alpha.6",
|
||||
"resolved": "https://registry.npmjs.org/react-native-actions-sheet/-/react-native-actions-sheet-0.9.0-alpha.6.tgz",
|
||||
"integrity": "sha512-CtSttiXk+pTmuzrtfDlX5cwYEBsS2DuvZSE17iEYzbTDaYQ2ahRn7+34h4kuDmqLvp9Sdksb7C8s5pFJj+S9sA==",
|
||||
"dependencies": {
|
||||
"@shopify/flash-list": "^1.4.1"
|
||||
},
|
||||
"version": "0.9.0-alpha.8",
|
||||
"resolved": "https://registry.npmjs.org/react-native-actions-sheet/-/react-native-actions-sheet-0.9.0-alpha.8.tgz",
|
||||
"integrity": "sha512-PNzZ4bPg99aX9rxZL9McglmnepUKQMRLloJRRvRAVNA45s1wWzWVyLQukv86/IPRnrrbg/fU/OaUkuFB07YOng==",
|
||||
"peerDependencies": {
|
||||
"react-native": "*",
|
||||
"react-native-gesture-handler": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-actions-sheet/node_modules/@shopify/flash-list": {
|
||||
"version": "1.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@shopify/flash-list/-/flash-list-1.4.1.tgz",
|
||||
"integrity": "sha512-yM5dlhqolO/R8FKomqCrSYz0Cc82vJDikxhbu1CXXGp3rPvo/ceP9jJyKueW96SXHsn/87fcSq2BjztWjlp74Q==",
|
||||
"dependencies": {
|
||||
"recyclerlistview": "4.2.0",
|
||||
"tslib": "2.4.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/runtime": "*",
|
||||
"react": "*",
|
||||
"react-native": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-actions-shortcuts": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/react-native-actions-shortcuts/-/react-native-actions-shortcuts-1.0.1.tgz",
|
||||
@@ -24329,7 +24312,7 @@
|
||||
"qclone": "^1.2.0",
|
||||
"react": "18.0.0",
|
||||
"react-native": "0.69.7",
|
||||
"react-native-actions-sheet": "^0.9.0-alpha.6",
|
||||
"react-native-actions-sheet": "^0.9.0-alpha.8",
|
||||
"react-native-check-version": "https://github.com/flexible-agency/react-native-check-version",
|
||||
"react-native-drax": "^0.10.2",
|
||||
"react-native-image-zoom-viewer": "^3.0.1",
|
||||
@@ -34873,23 +34856,9 @@
|
||||
}
|
||||
},
|
||||
"react-native-actions-sheet": {
|
||||
"version": "0.9.0-alpha.6",
|
||||
"resolved": "https://registry.npmjs.org/react-native-actions-sheet/-/react-native-actions-sheet-0.9.0-alpha.6.tgz",
|
||||
"integrity": "sha512-CtSttiXk+pTmuzrtfDlX5cwYEBsS2DuvZSE17iEYzbTDaYQ2ahRn7+34h4kuDmqLvp9Sdksb7C8s5pFJj+S9sA==",
|
||||
"requires": {
|
||||
"@shopify/flash-list": "^1.4.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"@shopify/flash-list": {
|
||||
"version": "1.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@shopify/flash-list/-/flash-list-1.4.1.tgz",
|
||||
"integrity": "sha512-yM5dlhqolO/R8FKomqCrSYz0Cc82vJDikxhbu1CXXGp3rPvo/ceP9jJyKueW96SXHsn/87fcSq2BjztWjlp74Q==",
|
||||
"requires": {
|
||||
"recyclerlistview": "4.2.0",
|
||||
"tslib": "2.4.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
"version": "0.9.0-alpha.8",
|
||||
"resolved": "https://registry.npmjs.org/react-native-actions-sheet/-/react-native-actions-sheet-0.9.0-alpha.8.tgz",
|
||||
"integrity": "sha512-PNzZ4bPg99aX9rxZL9McglmnepUKQMRLloJRRvRAVNA45s1wWzWVyLQukv86/IPRnrrbg/fU/OaUkuFB07YOng=="
|
||||
},
|
||||
"react-native-actions-shortcuts": {
|
||||
"version": "1.0.1",
|
||||
|
||||
Reference in New Issue
Block a user