From e9d968aa8a99aca82028ff9c62c2951be6148b9d Mon Sep 17 00:00:00 2001 From: Ammar Ahmed Date: Wed, 8 Jul 2026 09:57:25 +0500 Subject: [PATCH] mobile: update ui --- .../app/components/attachments/actions.tsx | 220 +- .../attachments/attachment-item.tsx | 202 +- .../components/list-items/note/wrapper.tsx | 14 +- .../app/components/note-history/index.tsx | 265 - .../app/components/note-history/preview.tsx | 237 - .../app/components/properties/items.tsx | 4 +- .../components/sheets/publish-note/index.tsx | 460 +- .../components/sheets/references/index.tsx | 541 -- .../app/components/ui/input/form-input.tsx | 8 +- .../app/components/ui/pressable/use-button.ts | 9 + apps/mobile/app/hooks/use-actions.tsx | 18 +- .../app/navigation/navigation-stack.tsx | 39 + .../attachments/index.tsx | 452 +- .../mobile/app/screens/note-history/index.tsx | 247 + .../mobile/app/screens/note-preview/index.tsx | 298 ++ apps/mobile/app/screens/references/index.tsx | 426 ++ .../app/screens/relations-list/index.tsx | 78 +- .../settings/components/components.tsx | 2 - .../app/screens/settings/groups/account.ts | 6 +- apps/mobile/app/services/navigation.ts | 6 +- .../mobile/app/stores/use-navigation-store.ts | 20 +- .../fonts/notesnook-icons.glyphmap.json | 2 +- apps/mobile/fonts/notesnook-icons.ttf | Bin 34512 -> 36716 bytes .../ios/nanoicons-fonts/notesnook-icons.ttf | Bin 34512 -> 36716 bytes packages/editor/package-lock.json | 73 +- packages/icons/svgs/check-circle.svg | 10 + packages/icons/svgs/cloud-upload.svg | 10 + packages/icons/svgs/image.svg | 3 + packages/icons/svgs/link-simple.svg | 3 + packages/icons/svgs/music-notes.svg | 3 + packages/icons/svgs/upload.svg | 3 + packages/icons/svgs/video-camera.svg | 3 + packages/intl/locale/en.po | 3977 ++++++++------- packages/intl/locale/pseudo-LOCALE.po | 4515 +++++++++-------- packages/intl/src/strings.ts | 38 +- 35 files changed, 6294 insertions(+), 5898 deletions(-) delete mode 100644 apps/mobile/app/components/note-history/index.tsx delete mode 100644 apps/mobile/app/components/note-history/preview.tsx delete mode 100644 apps/mobile/app/components/sheets/references/index.tsx rename apps/mobile/app/{components => screens}/attachments/index.tsx (63%) create mode 100644 apps/mobile/app/screens/note-history/index.tsx create mode 100644 apps/mobile/app/screens/note-preview/index.tsx create mode 100644 apps/mobile/app/screens/references/index.tsx create mode 100755 packages/icons/svgs/check-circle.svg create mode 100644 packages/icons/svgs/cloud-upload.svg create mode 100755 packages/icons/svgs/image.svg create mode 100644 packages/icons/svgs/link-simple.svg create mode 100755 packages/icons/svgs/music-notes.svg create mode 100755 packages/icons/svgs/upload.svg create mode 100755 packages/icons/svgs/video-camera.svg diff --git a/apps/mobile/app/components/attachments/actions.tsx b/apps/mobile/app/components/attachments/actions.tsx index 4ee2de59e..908bf4052 100644 --- a/apps/mobile/app/components/attachments/actions.tsx +++ b/apps/mobile/app/components/attachments/actions.tsx @@ -19,6 +19,7 @@ along with this program. If not, see . import { formatBytes } from "@notesnook/common"; import { Attachment, Note, VirtualizedGrouping } from "@notesnook/core"; +import { strings } from "@notesnook/intl"; import { useThemeColors } from "@notesnook/theme"; import Clipboard from "@react-native-clipboard/clipboard"; import React, { RefObject, useEffect, useState } from "react"; @@ -26,6 +27,7 @@ import { TextInput, View } from "react-native"; import { ActionSheetRef } from "react-native-actions-sheet"; import { ScrollView } from "react-native-gesture-handler"; import { db } from "../../common/database"; +import { Radius, Spacing } from "../../common/design/spacing"; import filesystem from "../../common/filesystem"; import downloadAttachment from "../../common/filesystem/download-attachment"; import { useAttachmentProgress } from "../../hooks/use-attachment-progress"; @@ -37,6 +39,7 @@ import { eSendEvent, presentSheet } from "../../services/event-manager"; +import Navigation from "../../services/navigation"; import PremiumService from "../../services/premium"; import { useAttachmentStore } from "../../stores/use-attachment-store"; import { @@ -46,20 +49,19 @@ import { eOnLoadNote } from "../../utils/events"; import { AppFontSize } from "../../utils/size"; +import { DefaultAppStyles } from "../../utils/styles"; import { Dialog } from "../dialog"; import { presentDialog } from "../dialog/functions"; import { openNote } from "../list-items/note/wrapper"; import { DateMeta } from "../properties/date-meta"; import SheetProvider from "../sheet-provider"; -import { Button } from "../ui/button"; +import AppIcon from "../ui/AppIcon"; +import { createFormRef, validators } from "../ui/input/form-input"; import { Notice } from "../ui/notice"; import { Pressable } from "../ui/pressable"; +import LineSeparator from "../ui/seperator/line-separator"; import Heading from "../ui/typography/heading"; import Paragraph from "../ui/typography/paragraph"; -import { strings } from "@notesnook/intl"; -import { DefaultAppStyles } from "../../utils/styles"; -import Navigation from "../../services/navigation"; -import { createFormRef, validators } from "../ui/input/form-input"; const Actions = ({ attachment, @@ -94,7 +96,7 @@ const Actions = ({ downloadAttachment(attachment.hash, context === "global"); fwdRef.current?.hide(); }, - icon: "download" + icon: "download-simple" }, { name: strings.network.reupload(), @@ -114,7 +116,7 @@ const Actions = ({ type: attachment.mimeType.startsWith("image") ? "image" : "file" }); }, - icon: "upload" + icon: "upload-simple" }, { name: strings.fileCheck(), @@ -149,7 +151,7 @@ const Actions = ({ name: undefined }); }, - icon: "file-check" + icon: "file" }, { name: strings.rename(), @@ -197,7 +199,7 @@ const Actions = ({ }); }, 500); }, - icon: "form-textbox" + icon: "pencil-simple" }, { name: strings.delete(), @@ -249,7 +251,7 @@ const Actions = ({ }); }, 500); }, - icon: "delete-outline" + icon: "trash" } ]; @@ -267,6 +269,7 @@ const Actions = ({ onMomentumScrollEnd={() => { fwdRef?.current?.handleChildScrollEnd(); }} + bounces={false} nestedScrollEnabled={true} style={{ maxHeight: "100%" @@ -277,42 +280,34 @@ const Actions = ({ 0 ? 0 : DefaultAppStyles.GAP_VERTICAL + paddingHorizontal: Spacing.LEVEL_3, + paddingTop: Spacing.LEVEL_4, + gap: Spacing.LEVEL_1 }} > - - {filename} - + {filename} - + {attachment.mimeType} + {formatBytes(attachment.size)} - + {notes.length ? ( - + {strings.notes(notes.length)} ) : null} + { Clipboard.setString(attachment.hash); @@ -322,82 +317,123 @@ const Actions = ({ context: "local" }); }} - size={AppFontSize.xs} + fontSize="XS" color={colors.secondary.paragraph} > + {" "} {attachment.hash} + + {notes && notes.length > 0 ? ( - - <> - - {strings.listOf()} {strings.dataTypesPlural.note()}: - + <> + + + <> + + {strings.notes(notes.length)} + - {notes.map((item) => ( - { - eSendEvent(eCloseSheet, contextId); - close?.(); - eSendEvent(eCloseAttachmentDialog); - Navigation.navigate("FluidPanelsView"); - openNote(item, (item as any).type === "trash"); - }} - style={{ - paddingVertical: DefaultAppStyles.GAP_VERTICAL, - alignItems: "flex-start", - - paddingHorizontal: DefaultAppStyles.GAP - }} - key={item.id} - > - {item.title} - - ))} - - + {notes.map((item) => ( + { + eSendEvent(eCloseSheet, contextId); + close?.(); + eSendEvent(eCloseAttachmentDialog); + Navigation.navigate("FluidPanelsView"); + openNote(item, (item as any).type === "trash"); + }} + style={{ + alignItems: "flex-start" + }} + key={item.id} + > + {item.title} + + ))} + + + ) : null} - {actions.map((item) => ( -