diff --git a/apps/mobile/app/share/share.tsx b/apps/mobile/app/share/share.tsx
index 78638ebf3..85fac5197 100644
--- a/apps/mobile/app/share/share.tsx
+++ b/apps/mobile/app/share/share.tsx
@@ -23,6 +23,7 @@ import ShareExtension, {
import { getPreviewData } from "@flyerhq/react-native-link-preview";
import {
formatBytes,
+ getFormattedDate,
isFeatureAvailable,
useIsFeatureAvailable
} from "@notesnook/common";
@@ -47,7 +48,6 @@ import {
import RNFetchBlob from "react-native-blob-util";
import {
SafeAreaProvider,
- SafeAreaView,
useSafeAreaInsets
} from "react-native-safe-area-context";
import Icon from "react-native-vector-icons/MaterialCommunityIcons";
@@ -70,14 +70,20 @@ import { Search } from "./search";
import { initDatabase, useShareStore } from "./store";
import { isTablet } from "react-native-device-info";
import { NotesnookModule } from "../utils/notesnook-module";
+import { DefaultAppStyles } from "../utils/styles";
const getLinkPreview = (url: string) => {
return getPreviewData(url, 5000);
};
-async function sanitizeHtml(site: string) {
+async function sanitizeHtml(site: string, title?: string) {
try {
let html = await fetchHandle.current?.processUrl(site);
- return html;
+ return (
+ html +
+ "
" +
+ `Clipped from ${title || site}
+Date clipped ${getFormattedDate(Date.now())}
`
+ );
} catch (e) {
return "";
}
@@ -145,6 +151,7 @@ const ShareView = () => {
const noteContent = useRef(undefined);
const noteTitle = useRef(undefined);
const [loading, setLoading] = useState(false);
+ const [loadingData, setLoadingData] = useState(true);
const [loadingExtension, setLoadingExtension] = useState(true);
const fullQualityImages = useIsFeatureAvailable("fullQualityImages");
const [rawData, setRawData] = useState<{
@@ -215,7 +222,6 @@ const ShareView = () => {
};
const onLoad = useCallback(() => {
- console.log(noteContent.current, "current...");
eSendEvent(eOnLoadNote + "shareEditor", {
id: null,
content: {
@@ -231,6 +237,7 @@ const ShareView = () => {
try {
if (noteContent.current) {
onLoad();
+ setLoadingData(false);
return;
}
defaultNote.content.data = undefined;
@@ -247,6 +254,7 @@ const ShareView = () => {
editorRef.current?.focus();
}, 300);
}
+ setLoadingData(false);
return;
}
@@ -303,7 +311,9 @@ const ShareView = () => {
});
onLoad();
setNote({ ...note });
+ setLoadingData(false);
} catch (e) {
+ setLoadingData(false);
console.error(e);
}
},
@@ -316,6 +326,7 @@ const ShareView = () => {
await initDatabase();
setLoadingExtension(false);
useShareStore.getState().restore();
+ loadData(false);
} catch (e) {
DatabaseLogger.error(e);
}
@@ -394,7 +405,7 @@ const ShareView = () => {
if (value === 2) {
setLoadingPage(true);
setTimeout(async () => {
- let html = await sanitizeHtml(rawData?.value || "");
+ let html = await sanitizeHtml(rawData?.value || "", note.title);
noteContent.current = html || "";
setLoadingPage(false);
onLoad();
@@ -508,391 +519,407 @@ const ShareView = () => {
: insets.bottom
}}
>
-
+ {loadingData ? (
+
+ Loading clip...
+
+ ) : (
+
- {appendNoteId ? (
-
- Save note
-
- ) : (
- {
- noteTitle.current = value;
- }}
- defaultValue={noteTitle.current}
- blurOnSubmit={false}
- onSubmitEditing={() => {
- editorRef.current?.focus();
- }}
- />
- )}
-
-
-
- {rawFiles?.length > 0 ? (
-
+ Save note
+
+ ) : (
+ {
+ noteTitle.current = value;
+ }}
+ defaultValue={noteTitle.current}
+ blurOnSubmit={false}
+ onSubmitEditing={() => {
+ editorRef.current?.focus();
+ }}
+ />
+ )}
+
-
- {rawFiles.map((item) =>
- isImage(item.type) || item.value?.endsWith(".png") ? (
- onRemoveFile(item)}
- key={item.name}
- activeOpacity={0.9}
- >
-
-
- ) : (
- onRemoveFile(item)}
- style={{
- borderRadius: defaultBorderRadius,
- backgroundColor: colors.secondary.background,
- flexDirection: "row",
- borderWidth: 1,
- borderColor: colors.primary.border,
- alignItems: "center",
- paddingVertical: 5,
- paddingHorizontal: 8,
- marginRight: 6
- }}
- >
-
+ />
+
-
- {item.name || item.value.split("/").pop()}
- {item.size ? `(${formatBytes(item.size)})` : ""}
-
-
- )
- )}
-
-
- 0 ? (
+
- Tap to remove an attachment.
-
- {rawFiles.some((item) => isImage(item.type)) ? (
-
+ Attaching {rawFiles.length} file(s):
+
+
+ {rawFiles.map((item) =>
+ isImage(item.type) || item.value?.endsWith(".png") ? (
+ onRemoveFile(item)}
+ key={item.name}
+ activeOpacity={0.9}
+ >
+
+
+ ) : (
+ onRemoveFile(item)}
+ style={{
+ borderRadius: defaultBorderRadius,
+ backgroundColor: colors.secondary.background,
+ flexDirection: "row",
+ borderWidth: 1,
+ borderColor: colors.primary.border,
+ alignItems: "center",
+ paddingVertical: 5,
+ paddingHorizontal: 8,
+ marginRight: 6
+ }}
+ >
+
+
+
+ {item.name || item.value.split("/").pop()}
+ {item.size ? `(${formatBytes(item.size)})` : ""}
+
+
+ )
+ )}
+
+
+ {
- if (fullQualityImages?.isAllowed) {
- setCompress(!compress);
- }
- }}
>
-
-
-
+ {rawFiles.some((item) => isImage(item.type)) ? (
+ {
+ if (fullQualityImages?.isAllowed) {
+ setCompress(!compress);
+ }
}}
- allowFontScaling={false}
>
- Compress image(s) (recommended)
-
-
- ) : null}
+
+
+
+ Compress image(s) (recommended)
+
+
+ ) : null}
+
+ ) : null}
+ 0 ? 100 : 200,
+ paddingBottom: 15,
+ marginBottom: 10,
+ borderBottomColor: colors.secondary.background,
+ borderBottomWidth: 1
+ }}
+ >
+
+ {!loadingExtension && !loadingPage ? (
+ <>
+ {
+ noteContent.current = html;
+ }}
+ />
+ >
+ ) : (
+ <>
+ {loadingPage ? (
+ <>
+
+ Preparing web clip...
+ >
+ ) : null}
+ >
+ )}
+
- ) : null}
- 0 ? 100 : 200,
- paddingBottom: 15,
- marginBottom: 10,
- borderBottomColor: colors.secondary.background,
- borderBottomWidth: 1
- }}
- >
- {
+ if (!noteTitle.current) {
+ noteTitle.current = title;
+ inputRef.current?.setNativeProps?.({
+ text: noteTitle.current
+ });
+ }
+ }}
+ />
+ ) : null}
+
+
- {!loadingExtension && !loadingPage ? (
- <>
- {
- noteContent.current = html;
- }}
- />
- >
- ) : (
- <>
- {loadingPage ? (
- <>
-
- Preparing web clip...
- >
- ) : null}
- >
- )}
-
-
-
- {appendNoteId ? (
- {
- if (!noteTitle.current) {
- noteTitle.current = title;
- inputRef.current?.setNativeProps?.({
- text: noteTitle.current
- });
- }
- }}
- />
- ) : null}
-
-
-
- Clip Mode:
-
- {rawData.value && isURL(rawData.value) ? (
-
-
-
- {
- useShareStore.getState().setAppendNote(null);
- }}
- type={!appendNoteId ? "transparent" : "plain"}
- title="New note"
- allowFontScaling={false}
+
-
- {
- setSearchMode("appendNote");
- }}
- allowFontScaling={false}
- type={appendNoteId ? "transparent" : "plain"}
- title={`Append to a note`}
- style={{
+ borderRadius: 10,
+ flexDirection: "column",
+ marginTop: 10,
+ alignSelf: "center",
+ alignItems: "center",
paddingHorizontal: 12,
- height: 45,
- width: "100%",
- marginRight: 0,
- borderWidth: 1,
- borderColor: colors.secondary.background,
- justifyContent: "flex-start"
+ gap: 10
}}
- />
-
- {!appendNoteId ? (
-
+ {
- setSearchMode("selectTags");
+ useShareStore.getState().setAppendNote(null);
+ }}
+ type={!appendNoteId ? "transparent" : "plain"}
+ title="New note"
+ allowFontScaling={false}
+ style={{
+ paddingHorizontal: 12,
+ height: 45,
+ width: "100%",
+ marginRight: 0,
+ borderWidth: 1,
+ borderColor: colors.secondary.background,
+ justifyContent: "flex-start"
}}
/>
- ) : null}
- {!appendNoteId ? (
- {
- setSearchMode("selectNotebooks");
+ setSearchMode("appendNote");
+ }}
+ allowFontScaling={false}
+ type={appendNoteId ? "transparent" : "plain"}
+ title={`Append to a note`}
+ style={{
+ paddingHorizontal: 12,
+ height: 45,
+ width: "100%",
+ marginRight: 0,
+ borderWidth: 1,
+ borderColor: colors.secondary.background,
+ justifyContent: "flex-start"
}}
/>
- ) : null}
-
-
-
-
+ {!appendNoteId ? (
+ {
+ setSearchMode("selectTags");
+ }}
+ />
+ ) : null}
+
+ {!appendNoteId ? (
+ {
+ setSearchMode("selectNotebooks");
+ }}
+ />
+ ) : null}
+
+
+
+
+
+ )}
);