From b305c3d84774ab83a8119ea5dd2a3f98d59946ef Mon Sep 17 00:00:00 2001 From: natjms Date: Mon, 9 May 2022 15:04:11 -0700 Subject: [PATCH] Begin upgrade to react-navigation 6 --- package-lock.json | 297 ++++++++++++------ package.json | 8 +- src/App.js | 169 +++++++--- src/components/context-menu.js | 4 +- src/components/moderate-menu.js | 4 +- src/components/navigation/back-bar.js | 50 --- src/components/navigation/navigators.js | 63 ---- src/components/navigation/tray.js | 98 ------ src/components/pages/authenticate.js | 8 +- src/components/pages/direct.js | 15 +- src/components/pages/direct/conversation.js | 19 +- src/components/pages/discover.js | 18 +- src/components/pages/discover/search.js | 42 ++- src/components/pages/discover/view-hashtag.js | 13 +- src/components/pages/feed.js | 41 ++- src/components/pages/feed/older-posts.js | 13 +- src/components/pages/profile.js | 37 +-- src/components/pages/profile/notifications.js | 74 +++-- src/components/pages/profile/settings.js | 10 +- src/components/pages/publish.js | 11 +- src/components/pages/user-list.js | 13 +- src/components/pages/view-comments.js | 38 ++- src/components/pages/view-post.js | 46 +-- src/components/posts/grid-view.js | 8 +- src/components/posts/paged-grid.js | 4 +- src/components/posts/post-action-bar.js | 12 +- src/components/posts/post.js | 30 +- src/components/posts/timeline-view.js | 8 +- 28 files changed, 540 insertions(+), 613 deletions(-) delete mode 100644 src/components/navigation/back-bar.js delete mode 100644 src/components/navigation/navigators.js delete mode 100644 src/components/navigation/tray.js diff --git a/package-lock.json b/package-lock.json index c773c5b..c5f0878 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7,9 +7,10 @@ "dependencies": { "@react-native-async-storage/async-storage": "^1.13.0", "@react-native-community/masked-view": "0.1.10", - "@react-navigation/core": "5.2.3", - "@react-navigation/native": "5.1.1", - "@react-navigation/stack": "5.2.3", + "@react-navigation/bottom-tabs": "^6.3.1", + "@react-navigation/core": "^6.2.1", + "@react-navigation/native": "^6.0.10", + "@react-navigation/stack": "^6.2.1", "expo": "^41.0.0", "expo-image-picker": "~10.1.4", "expo-linking": "~2.2.3", @@ -28,7 +29,6 @@ "react-native-screens": "~3.0.0", "react-native-tab-view": "^2.16.0", "react-native-web": "~0.13.12", - "react-navigation": "^4.4.0", "react-navigation-stack": "^2.8.2" }, "devDependencies": { @@ -3710,58 +3710,127 @@ "react-native": ">=0.57" } }, - "node_modules/@react-navigation/core": { - "version": "5.2.3", - "resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-5.2.3.tgz", - "integrity": "sha512-iWSj7Eep4qWuEZ/LYSSsK9vs0AskUkIQM3+SmeZJxIqOIQw7nVQZ4sa4RbYbX/PxOBbZ/SOOKcCNuZ7zilve5A==", + "node_modules/@react-navigation/bottom-tabs": { + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/@react-navigation/bottom-tabs/-/bottom-tabs-6.3.1.tgz", + "integrity": "sha512-sL9F4WMhhR6I9bE7bpsPVHnK1cN9doaFHAuy5YmD+Sw6OyO0TAmNgQFx4xZWqboA5ZwSkN0tWcRCr6wGXaRRag==", "dependencies": { - "@react-navigation/routers": "^5.1.1", - "escape-string-regexp": "^2.0.0", - "query-string": "^6.11.1", - "react-is": "^16.13.0", - "shortid": "^2.2.15", - "use-subscription": "^1.4.0" + "@react-navigation/elements": "^1.3.3", + "color": "^3.1.3", + "warn-once": "^0.1.0" + }, + "peerDependencies": { + "@react-navigation/native": "^6.0.0", + "react": "*", + "react-native": "*", + "react-native-safe-area-context": ">= 3.0.0", + "react-native-screens": ">= 3.0.0" + } + }, + "node_modules/@react-navigation/core": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-6.2.1.tgz", + "integrity": "sha512-3mjS6ujwGnPA/BC11DN9c2c42gFld6B6dQBgDedxP2djceXESpY2kVTTwISDHuqFnF7WjvRjsrDu3cKBX+JosA==", + "dependencies": { + "@react-navigation/routers": "^6.1.0", + "escape-string-regexp": "^4.0.0", + "nanoid": "^3.1.23", + "query-string": "^7.0.0", + "react-is": "^16.13.0" }, "peerDependencies": { "react": "*" } }, - "node_modules/@react-navigation/native": { - "version": "5.1.1", - "resolved": "https://registry.npmjs.org/@react-navigation/native/-/native-5.1.1.tgz", - "integrity": "sha512-AzHuO5egm5+JT+M37imyVDe6vfY3mr+HO3FpRTAvXuJabDV5flcLUTIiLuvmd3iyNRFJFR6bCbDirwwmVWMAXg==", + "node_modules/@react-navigation/core/node_modules/escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@react-navigation/core/node_modules/query-string": { + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/query-string/-/query-string-7.1.1.tgz", + "integrity": "sha512-MplouLRDHBZSG9z7fpuAAcI7aAYjDLhtsiVZsevsfaHWDS2IDdORKbSd1kWUA+V4zyva/HZoSfpwnYMMQDhb0w==", "dependencies": { - "@react-navigation/core": "^5.2.3" + "decode-uri-component": "^0.2.0", + "filter-obj": "^1.1.0", + "split-on-first": "^1.0.0", + "strict-uri-encode": "^2.0.0" + }, + "engines": { + "node": ">=6" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@react-navigation/elements": { + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/@react-navigation/elements/-/elements-1.3.3.tgz", + "integrity": "sha512-Lv2lR7si5gNME8dRsqz57d54m4FJtrwHRjNQLOyQO546ZxO+g864cSvoLC6hQedQU0+IJnPTsZiEI2hHqfpEpw==", + "peerDependencies": { + "@react-navigation/native": "^6.0.0", + "react": "*", + "react-native": "*", + "react-native-safe-area-context": ">= 3.0.0" + } + }, + "node_modules/@react-navigation/native": { + "version": "6.0.10", + "resolved": "https://registry.npmjs.org/@react-navigation/native/-/native-6.0.10.tgz", + "integrity": "sha512-H6QhLeiieGxNcAJismIDXIPZgf1myr7Og8v116tezIGmincJTOcWavTd7lPHGnMMXaZg94LlVtbaBRIx9cexqw==", + "dependencies": { + "@react-navigation/core": "^6.2.1", + "escape-string-regexp": "^4.0.0", + "fast-deep-equal": "^3.1.3", + "nanoid": "^3.1.23" }, "peerDependencies": { "react": "*", "react-native": "*" } }, + "node_modules/@react-navigation/native/node_modules/escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/@react-navigation/routers": { - "version": "5.7.2", - "resolved": "https://registry.npmjs.org/@react-navigation/routers/-/routers-5.7.2.tgz", - "integrity": "sha512-BxNSMLHpU+oS37Xok0ql6rc9U7IC8aUD4+U5ZPbjDJ0pwzZxGGh0YOEBzfV4k/Ig3cbPdvVWbc1C9HHbCVr2oQ==", + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/@react-navigation/routers/-/routers-6.1.0.tgz", + "integrity": "sha512-8xJL+djIzpFdRW/sGlKojQ06fWgFk1c5jER9501HYJ12LF5DIJFr/tqBI2TJ6bk+y+QFu0nbNyeRC80OjRlmkA==", "dependencies": { - "nanoid": "^3.1.15" + "nanoid": "^3.1.23" } }, "node_modules/@react-navigation/stack": { - "version": "5.2.3", - "resolved": "https://registry.npmjs.org/@react-navigation/stack/-/stack-5.2.3.tgz", - "integrity": "sha512-mCji6N6r03sTMF09hbVmhdCZHcuIrZCr/MY8yuiG+kzzYcFfj+72wwJ885erKw32jBKAaJV8wZNq8W0K+ZiCQQ==", + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@react-navigation/stack/-/stack-6.2.1.tgz", + "integrity": "sha512-JI7boxtPAMCBXi4VJHVEq61jLVHFW5f3npvbndS+XfOsv7Gf0f91HOVJ28DS5c2Fn4+CO4AByjUozzlN296X+A==", "dependencies": { - "color": "^3.1.2", - "react-native-iphone-x-helper": "^1.2.1" + "@react-navigation/elements": "^1.3.3", + "color": "^3.1.3", + "warn-once": "^0.1.0" }, "peerDependencies": { - "@react-native-community/masked-view": ">= 0.1.0", - "@react-navigation/native": "^5.0.5", + "@react-navigation/native": "^6.0.0", "react": "*", "react-native": "*", "react-native-gesture-handler": ">= 1.0.0", - "react-native-safe-area-context": ">= 0.6.0", - "react-native-screens": ">= 2.0.0-alpha.0 || >= 2.0.0-beta.0 || >= 2.0.0" + "react-native-safe-area-context": ">= 3.0.0", + "react-native-screens": ">= 3.0.0" } }, "node_modules/@types/hammerjs": { @@ -6182,6 +6251,11 @@ "node": ">= 0.10" } }, + "node_modules/fast-deep-equal": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", + "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==" + }, "node_modules/fb-watchman": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.1.tgz", @@ -9084,6 +9158,7 @@ "version": "1.8.0", "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz", "integrity": "sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==", + "peer": true, "dependencies": { "isarray": "0.0.1" } @@ -9091,7 +9166,8 @@ "node_modules/path-to-regexp/node_modules/isarray": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz", - "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=" + "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=", + "peer": true }, "node_modules/phin": { "version": "2.9.3", @@ -9462,6 +9538,7 @@ "version": "6.14.1", "resolved": "https://registry.npmjs.org/query-string/-/query-string-6.14.1.tgz", "integrity": "sha512-XDxAeVmpfu1/6IjyT/gXHOl+S0vQ9owggJ30hhWKdHAsNPOcasn5o9BW0eejZqL2e4vMjhAxoW3jVHcD6mbcYw==", + "peer": true, "dependencies": { "decode-uri-component": "^0.2.0", "filter-obj": "^1.1.0", @@ -9699,6 +9776,7 @@ "version": "0.14.9", "resolved": "https://registry.npmjs.org/react-native-safe-area-view/-/react-native-safe-area-view-0.14.9.tgz", "integrity": "sha512-WII/ulhpVyL/qbYb7vydq7dJAfZRBcEhg4/UWt6F6nAKpLa3gAceMOxBxI914ppwSP/TdUsandFy6lkJQE0z4A==", + "peer": true, "dependencies": { "hoist-non-react-statics": "^2.3.1" }, @@ -9710,7 +9788,8 @@ "node_modules/react-native-safe-area-view/node_modules/hoist-non-react-statics": { "version": "2.5.5", "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz", - "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==" + "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==", + "peer": true }, "node_modules/react-native-screens": { "version": "3.0.0", @@ -9868,6 +9947,7 @@ "version": "4.4.4", "resolved": "https://registry.npmjs.org/react-navigation/-/react-navigation-4.4.4.tgz", "integrity": "sha512-08Nzy1aKEd73496CsuzN49vLFmxPKYF5WpKGgGvkQ10clB79IRM2BtAfVl6NgPKuUM8FXq1wCsrjo/c5ftl5og==", + "peer": true, "dependencies": { "@react-navigation/core": "^3.7.9", "@react-navigation/native": "^3.8.4" @@ -9899,6 +9979,7 @@ "version": "3.7.9", "resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-3.7.9.tgz", "integrity": "sha512-EknbzM8OI9A5alRxXtQRV5Awle68B+z1QAxNty5DxmlS3BNfmduWNGnim159ROyqxkuDffK9L/U/Tbd45mx+Jg==", + "peer": true, "dependencies": { "hoist-non-react-statics": "^3.3.2", "path-to-regexp": "^1.8.0", @@ -9913,6 +9994,7 @@ "version": "3.8.4", "resolved": "https://registry.npmjs.org/@react-navigation/native/-/native-3.8.4.tgz", "integrity": "sha512-gXSVcL7bfFDyVkvyg1FiAqTCIgZub5K1X/TZqURBs2CPqDpfX1OsCtB9D33eTF14SpbfgHW866btqrrxoCACfg==", + "peer": true, "dependencies": { "hoist-non-react-statics": "^3.3.2", "react-native-safe-area-view": "^0.14.9" @@ -10391,19 +10473,6 @@ "jsonify": "~0.0.0" } }, - "node_modules/shortid": { - "version": "2.2.16", - "resolved": "https://registry.npmjs.org/shortid/-/shortid-2.2.16.tgz", - "integrity": "sha512-Ugt+GIZqvGXCIItnsL+lvFJOiN7RYqlGy7QE41O3YC1xbNSeDGIRO7xg2JJXIAj1cAGnOeC1r7/T9pgrtQbv4g==", - "dependencies": { - "nanoid": "^2.1.0" - } - }, - "node_modules/shortid/node_modules/nanoid": { - "version": "2.1.11", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-2.1.11.tgz", - "integrity": "sha512-s/snB+WGm6uwi0WjsZdaVcuf3KJXlfGl2LcxgwkEwJF0D/BWzVWAZW/XY4bFaiR7s0Jk3FPvlnepg1H1b1UwlA==" - }, "node_modules/side-channel": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz", @@ -11426,6 +11495,11 @@ "makeerror": "1.0.x" } }, + "node_modules/warn-once": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/warn-once/-/warn-once-0.1.0.tgz", + "integrity": "sha512-recZTSvuaH/On5ZU5ywq66y99lImWqzP93+AiUo9LUwG8gXHW+LJjhOd6REJHm7qb0niYqrEQJvbHSQfuJtTqA==" + }, "node_modules/warning": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.1.tgz", @@ -14506,42 +14580,86 @@ "integrity": "sha512-rk4sWFsmtOw8oyx8SD3KSvawwaK7gRBSEIy2TAwURyGt+3TizssXP1r8nx3zY+R7v2vYYHXZ+k2/GULAT/bcaQ==", "requires": {} }, - "@react-navigation/core": { - "version": "5.2.3", - "resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-5.2.3.tgz", - "integrity": "sha512-iWSj7Eep4qWuEZ/LYSSsK9vs0AskUkIQM3+SmeZJxIqOIQw7nVQZ4sa4RbYbX/PxOBbZ/SOOKcCNuZ7zilve5A==", + "@react-navigation/bottom-tabs": { + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/@react-navigation/bottom-tabs/-/bottom-tabs-6.3.1.tgz", + "integrity": "sha512-sL9F4WMhhR6I9bE7bpsPVHnK1cN9doaFHAuy5YmD+Sw6OyO0TAmNgQFx4xZWqboA5ZwSkN0tWcRCr6wGXaRRag==", "requires": { - "@react-navigation/routers": "^5.1.1", - "escape-string-regexp": "^2.0.0", - "query-string": "^6.11.1", - "react-is": "^16.13.0", - "shortid": "^2.2.15", - "use-subscription": "^1.4.0" + "@react-navigation/elements": "^1.3.3", + "color": "^3.1.3", + "warn-once": "^0.1.0" } }, - "@react-navigation/native": { - "version": "5.1.1", - "resolved": "https://registry.npmjs.org/@react-navigation/native/-/native-5.1.1.tgz", - "integrity": "sha512-AzHuO5egm5+JT+M37imyVDe6vfY3mr+HO3FpRTAvXuJabDV5flcLUTIiLuvmd3iyNRFJFR6bCbDirwwmVWMAXg==", + "@react-navigation/core": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-6.2.1.tgz", + "integrity": "sha512-3mjS6ujwGnPA/BC11DN9c2c42gFld6B6dQBgDedxP2djceXESpY2kVTTwISDHuqFnF7WjvRjsrDu3cKBX+JosA==", "requires": { - "@react-navigation/core": "^5.2.3" + "@react-navigation/routers": "^6.1.0", + "escape-string-regexp": "^4.0.0", + "nanoid": "^3.1.23", + "query-string": "^7.0.0", + "react-is": "^16.13.0" + }, + "dependencies": { + "escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==" + }, + "query-string": { + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/query-string/-/query-string-7.1.1.tgz", + "integrity": "sha512-MplouLRDHBZSG9z7fpuAAcI7aAYjDLhtsiVZsevsfaHWDS2IDdORKbSd1kWUA+V4zyva/HZoSfpwnYMMQDhb0w==", + "requires": { + "decode-uri-component": "^0.2.0", + "filter-obj": "^1.1.0", + "split-on-first": "^1.0.0", + "strict-uri-encode": "^2.0.0" + } + } + } + }, + "@react-navigation/elements": { + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/@react-navigation/elements/-/elements-1.3.3.tgz", + "integrity": "sha512-Lv2lR7si5gNME8dRsqz57d54m4FJtrwHRjNQLOyQO546ZxO+g864cSvoLC6hQedQU0+IJnPTsZiEI2hHqfpEpw==", + "requires": {} + }, + "@react-navigation/native": { + "version": "6.0.10", + "resolved": "https://registry.npmjs.org/@react-navigation/native/-/native-6.0.10.tgz", + "integrity": "sha512-H6QhLeiieGxNcAJismIDXIPZgf1myr7Og8v116tezIGmincJTOcWavTd7lPHGnMMXaZg94LlVtbaBRIx9cexqw==", + "requires": { + "@react-navigation/core": "^6.2.1", + "escape-string-regexp": "^4.0.0", + "fast-deep-equal": "^3.1.3", + "nanoid": "^3.1.23" + }, + "dependencies": { + "escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==" + } } }, "@react-navigation/routers": { - "version": "5.7.2", - "resolved": "https://registry.npmjs.org/@react-navigation/routers/-/routers-5.7.2.tgz", - "integrity": "sha512-BxNSMLHpU+oS37Xok0ql6rc9U7IC8aUD4+U5ZPbjDJ0pwzZxGGh0YOEBzfV4k/Ig3cbPdvVWbc1C9HHbCVr2oQ==", + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/@react-navigation/routers/-/routers-6.1.0.tgz", + "integrity": "sha512-8xJL+djIzpFdRW/sGlKojQ06fWgFk1c5jER9501HYJ12LF5DIJFr/tqBI2TJ6bk+y+QFu0nbNyeRC80OjRlmkA==", "requires": { - "nanoid": "^3.1.15" + "nanoid": "^3.1.23" } }, "@react-navigation/stack": { - "version": "5.2.3", - "resolved": "https://registry.npmjs.org/@react-navigation/stack/-/stack-5.2.3.tgz", - "integrity": "sha512-mCji6N6r03sTMF09hbVmhdCZHcuIrZCr/MY8yuiG+kzzYcFfj+72wwJ885erKw32jBKAaJV8wZNq8W0K+ZiCQQ==", + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@react-navigation/stack/-/stack-6.2.1.tgz", + "integrity": "sha512-JI7boxtPAMCBXi4VJHVEq61jLVHFW5f3npvbndS+XfOsv7Gf0f91HOVJ28DS5c2Fn4+CO4AByjUozzlN296X+A==", "requires": { - "color": "^3.1.2", - "react-native-iphone-x-helper": "^1.2.1" + "@react-navigation/elements": "^1.3.3", + "color": "^3.1.3", + "warn-once": "^0.1.0" } }, "@types/hammerjs": { @@ -16503,6 +16621,11 @@ "time-stamp": "^1.0.0" } }, + "fast-deep-equal": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", + "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==" + }, "fb-watchman": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.1.tgz", @@ -18845,6 +18968,7 @@ "version": "1.8.0", "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz", "integrity": "sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==", + "peer": true, "requires": { "isarray": "0.0.1" }, @@ -18852,7 +18976,8 @@ "isarray": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz", - "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=" + "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=", + "peer": true } } }, @@ -19141,6 +19266,7 @@ "version": "6.14.1", "resolved": "https://registry.npmjs.org/query-string/-/query-string-6.14.1.tgz", "integrity": "sha512-XDxAeVmpfu1/6IjyT/gXHOl+S0vQ9owggJ30hhWKdHAsNPOcasn5o9BW0eejZqL2e4vMjhAxoW3jVHcD6mbcYw==", + "peer": true, "requires": { "decode-uri-component": "^0.2.0", "filter-obj": "^1.1.0", @@ -19410,6 +19536,7 @@ "version": "0.14.9", "resolved": "https://registry.npmjs.org/react-native-safe-area-view/-/react-native-safe-area-view-0.14.9.tgz", "integrity": "sha512-WII/ulhpVyL/qbYb7vydq7dJAfZRBcEhg4/UWt6F6nAKpLa3gAceMOxBxI914ppwSP/TdUsandFy6lkJQE0z4A==", + "peer": true, "requires": { "hoist-non-react-statics": "^2.3.1" }, @@ -19417,7 +19544,8 @@ "hoist-non-react-statics": { "version": "2.5.5", "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz", - "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==" + "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==", + "peer": true } } }, @@ -19475,6 +19603,7 @@ "version": "4.4.4", "resolved": "https://registry.npmjs.org/react-navigation/-/react-navigation-4.4.4.tgz", "integrity": "sha512-08Nzy1aKEd73496CsuzN49vLFmxPKYF5WpKGgGvkQ10clB79IRM2BtAfVl6NgPKuUM8FXq1wCsrjo/c5ftl5og==", + "peer": true, "requires": { "@react-navigation/core": "^3.7.9", "@react-navigation/native": "^3.8.4" @@ -19484,6 +19613,7 @@ "version": "3.7.9", "resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-3.7.9.tgz", "integrity": "sha512-EknbzM8OI9A5alRxXtQRV5Awle68B+z1QAxNty5DxmlS3BNfmduWNGnim159ROyqxkuDffK9L/U/Tbd45mx+Jg==", + "peer": true, "requires": { "hoist-non-react-statics": "^3.3.2", "path-to-regexp": "^1.8.0", @@ -19495,6 +19625,7 @@ "version": "3.8.4", "resolved": "https://registry.npmjs.org/@react-navigation/native/-/native-3.8.4.tgz", "integrity": "sha512-gXSVcL7bfFDyVkvyg1FiAqTCIgZub5K1X/TZqURBs2CPqDpfX1OsCtB9D33eTF14SpbfgHW866btqrrxoCACfg==", + "peer": true, "requires": { "hoist-non-react-statics": "^3.3.2", "react-native-safe-area-view": "^0.14.9" @@ -19897,21 +20028,6 @@ "jsonify": "~0.0.0" } }, - "shortid": { - "version": "2.2.16", - "resolved": "https://registry.npmjs.org/shortid/-/shortid-2.2.16.tgz", - "integrity": "sha512-Ugt+GIZqvGXCIItnsL+lvFJOiN7RYqlGy7QE41O3YC1xbNSeDGIRO7xg2JJXIAj1cAGnOeC1r7/T9pgrtQbv4g==", - "requires": { - "nanoid": "^2.1.0" - }, - "dependencies": { - "nanoid": { - "version": "2.1.11", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-2.1.11.tgz", - "integrity": "sha512-s/snB+WGm6uwi0WjsZdaVcuf3KJXlfGl2LcxgwkEwJF0D/BWzVWAZW/XY4bFaiR7s0Jk3FPvlnepg1H1b1UwlA==" - } - } - }, "side-channel": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz", @@ -20710,6 +20826,11 @@ "makeerror": "1.0.x" } }, + "warn-once": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/warn-once/-/warn-once-0.1.0.tgz", + "integrity": "sha512-recZTSvuaH/On5ZU5ywq66y99lImWqzP93+AiUo9LUwG8gXHW+LJjhOd6REJHm7qb0niYqrEQJvbHSQfuJtTqA==" + }, "warning": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.1.tgz", diff --git a/package.json b/package.json index 4f7594e..0ca1f96 100644 --- a/package.json +++ b/package.json @@ -10,9 +10,10 @@ "dependencies": { "@react-native-async-storage/async-storage": "^1.13.0", "@react-native-community/masked-view": "0.1.10", - "@react-navigation/core": "5.2.3", - "@react-navigation/native": "5.1.1", - "@react-navigation/stack": "5.2.3", + "@react-navigation/bottom-tabs": "^6.3.1", + "@react-navigation/core": "^6.2.1", + "@react-navigation/native": "^6.0.10", + "@react-navigation/stack": "^6.2.1", "expo": "^41.0.0", "expo-image-picker": "~10.1.4", "expo-linking": "~2.2.3", @@ -31,7 +32,6 @@ "react-native-screens": "~3.0.0", "react-native-tab-view": "^2.16.0", "react-native-web": "~0.13.12", - "react-navigation": "^4.4.0", "react-navigation-stack": "^2.8.2" }, "devDependencies": { diff --git a/src/App.js b/src/App.js index 4184d8c..aa4d8ea 100644 --- a/src/App.js +++ b/src/App.js @@ -1,73 +1,142 @@ import 'react-native-gesture-handler'; import React from "react"; -import { createAppContainer } from 'react-navigation'; -import { createStackNavigator } from "react-navigation-stack"; +import { createStackNavigator } from "@react-navigation/stack"; +import { createBottomTabNavigator } from "@react-navigation/bottom-tabs"; +import { NavigationContainer } from "@react-navigation/native"; import { MenuProvider } from "react-native-popup-menu"; +import { Ionicons } from "@expo/vector-icons"; import { registerRootComponent } from 'expo'; import * as Linking from "expo-linking"; -import ViewPostJsx from "src/components/pages/view-post"; -import ViewCommentsJsx from "src/components/pages/view-comments.js"; +import ViewPost from "src/components/pages/view-post"; +import ViewComments from "src/components/pages/view-comments.js"; -import AuthenticateJsx from "src/components/pages/authenticate"; -import FeedJsx from "src/components/pages/feed"; -import PublishJsx from "src/components/pages/publish"; -import OlderPostsJsx from "src/components/pages/feed/older-posts"; -import ProfileJsx, { ViewProfileJsx } from "src/components/pages/profile"; -import DiscoverJsx from 'src/components/pages/discover'; -import SearchJsx from 'src/components/pages/discover/search'; -import ViewHashtagJsx from 'src/components/pages/discover/view-hashtag'; -import DirectJsx from "src/components/pages/direct"; -import ConversationJsx, { ComposeJsx } from "src/components/pages/direct/conversation"; -import NotificationsJsx from 'src/components/pages/profile/notifications'; -import UserListJsx from "src/components/pages/user-list.js"; -import SettingsJsx from "src/components/pages/profile/settings.js"; - -const Stack = createStackNavigator({ - Authenticate: { - screen: AuthenticateJsx, - path: "authenticate", - }, - Feed: { screen: FeedJsx, }, - OlderPosts: { screen: OlderPostsJsx }, - Discover: { screen: DiscoverJsx }, - Publish: { screen: PublishJsx }, - Direct: { screen: DirectJsx }, - Compose: { screen: ComposeJsx }, - Conversation: { screen: ConversationJsx }, - Notifications: { screen: NotificationsJsx }, - Profile: { screen: ProfileJsx, }, - Settings: { screen: SettingsJsx }, - Search: { screen: SearchJsx }, - ViewPost: { screen: ViewPostJsx }, - ViewComments: { screen: ViewCommentsJsx }, - ViewProfile: { screen: ViewProfileJsx }, - ViewHashtag: { screen: ViewHashtagJsx }, - UserList: { screen: UserListJsx } -}, { - initialRouteKey: "Authenticate", - headerMode: "none", - navigationOptions: { - headerVisible: false - } -}); - -const AppContainer = createAppContainer(Stack); +import Authenticate from "src/components/pages/authenticate"; +import Feed from "src/components/pages/feed"; +import Publish from "src/components/pages/publish"; +import OlderPosts from "src/components/pages/feed/older-posts"; +import Profile, { ViewProfile } from "src/components/pages/profile"; +import Discover from 'src/components/pages/discover'; +import Search from 'src/components/pages/discover/search'; +import ViewHashtag from 'src/components/pages/discover/view-hashtag'; +import Direct from "src/components/pages/direct"; +import Conversation, { Compose } from "src/components/pages/direct/conversation"; +import Notifications from 'src/components/pages/profile/notifications'; +import UserList from "src/components/pages/user-list.js"; +import Settings from "src/components/pages/profile/settings.js"; const prefix = Linking.makeUrl("/"); +const Tab = createBottomTabNavigator(); + +const MainNavigator = () => { + // Tabbed navigator for Feed, Discover, Publish, Direct and Profile + + const bottomTabIcon = name => { + return ({ size }) => + }; + + const screenOptions = { + all: { + // Options that apply to every screen in the navigator + headerShown: false, + tabBarShowLabel: false, + tabBarStyle: { + height: 60, + } + }, + Feed: { + tabBarAccessibilityLabel: "Feed", + tabBarIcon: bottomTabIcon("home-outline"), + }, + Discover: { + tabBarAccessibilityLabel: "Discover", + tabBarIcon: bottomTabIcon("search-outline"), + }, + Publish: { + tabBarAccessibilityLabel: "Publish", + tabBarIcon: bottomTabIcon("camera-outline"), + }, + Direct: { + tabBarAccessibilityLabel: "Direct messages", + tabBarIcon: bottomTabIcon("mail-outline"), + }, + Profile: { + tabBarAccessibilityLabel: "Profile", + tabBarIcon: bottomTabIcon("person-outline"), + }, + }; + + return ( + + + + + + + + ); +}; + +const Stack = createStackNavigator(); const App = (props) => { const providerStyles = { backdrop: { backgroundColor: "black", opacity: 0.5 - } + }, + }; + + // This allows for the OAuth redirect + const linking = { + prefixes: [prefix], + config: { + screens: { + Authenticate: "authenticate", + }, + }, + }; + + const screenOptions = { + headerTitle: "", }; return - + + + + + + + + + + + + + + + + + ; }; diff --git a/src/components/context-menu.js b/src/components/context-menu.js index a992538..77c5ce5 100644 --- a/src/components/context-menu.js +++ b/src/components/context-menu.js @@ -13,7 +13,7 @@ const { SlideInMenu } = renderers; const SCREEN_WIDTH = Dimensions.get("window").width; -const ContextMenuJsx = (props) => { +const ContextMenu = (props) => { const optionsStyles = { optionWrapper: { // The wrapper around a single option paddingLeft: SCREEN_WIDTH / 15, @@ -47,4 +47,4 @@ const ContextMenuJsx = (props) => { ); } -export { ContextMenuJsx as default }; +export { ContextMenu as default }; diff --git a/src/components/moderate-menu.js b/src/components/moderate-menu.js index 90b5d5d..c2d371e 100644 --- a/src/components/moderate-menu.js +++ b/src/components/moderate-menu.js @@ -13,7 +13,7 @@ const { SlideInMenu } = renderers; const SCREEN_WIDTH = Dimensions.get("window").width; -const ModerateMenuJsx = (props) => { +const ModerateMenu = (props) => { const optionsStyles = { optionWrapper: { // The wrapper around a single option paddingLeft: SCREEN_WIDTH / 15, @@ -50,4 +50,4 @@ const ModerateMenuJsx = (props) => { ); } -export { ModerateMenuJsx as default }; +export { ModerateMenu as default }; diff --git a/src/components/navigation/back-bar.js b/src/components/navigation/back-bar.js deleted file mode 100644 index 1a5e09a..0000000 --- a/src/components/navigation/back-bar.js +++ /dev/null @@ -1,50 +0,0 @@ -import React from "react"; -import { Image } from "react-native"; -import { TouchableOpacity, View } from "react-native"; -import { Ionicons } from "@expo/vector-icons"; - -const BackBarJsx = (props) => { - - return ( - - props.navigation.goBack() } - style = { styles.button }> - - - - { props.children } - - - ); -}; - -const styles = { - nav: { - borderBottomWidth: 1, - borderBottomColor: "#CCC", - backgroundColor: "white", - - flexDirection: "row", - alignItems: "center", - paddingLeft: 10, - paddingRight: 10, - }, - rest: { - flexGrow: 1, - }, - chevron: { - width: 30, - height: 30, - }, - button: { - paddingRight: 10, - paddingTop: 10, - paddingBottom: 10, - }, -} - -export default BackBarJsx; diff --git a/src/components/navigation/navigators.js b/src/components/navigation/navigators.js deleted file mode 100644 index e4b0f4e..0000000 --- a/src/components/navigation/navigators.js +++ /dev/null @@ -1,63 +0,0 @@ -import React from "react"; -import { SafeAreaView } from "react-native"; -import { ScrollView } from "react-native-gesture-handler"; - -import { StatusBarSpace } from "src/interface/rendering"; -import BackBarJsx from "./back-bar"; -import TrayJsx from "src/components/navigation/tray"; - -export const ScreenWithTrayJsx = (props) => { - return ( - - - - { props.children } - - - - ); -}; - -export const ScreenWithBackBarJsx = (props) => { - return ( - - - - { props.renderBackBar != undefined - ? props.renderBackBar() - : <> - } - - - { props.children } - - - ); -}; - -export const ScreenWithFullNavigationJsx = (props) => { - return ( - - - - { props.renderBackBar != undefined - ? props.renderBackBar() - : <> - } - - - { props.children } - - - - ); -}; diff --git a/src/components/navigation/tray.js b/src/components/navigation/tray.js deleted file mode 100644 index 8745468..0000000 --- a/src/components/navigation/tray.js +++ /dev/null @@ -1,98 +0,0 @@ -import React, { useState, useEffect } from "react"; -import { - Image, - Dimensions, -} from "react-native"; -import { Ionicons } from "@expo/vector-icons"; - -import { checkUnreadNotifications } from "src/requests"; - -import { activeOrNot } from "src/interface/interactions" -import { TouchableWithoutFeedback, View } from "react-native"; - -const TrayButtonJsx = (props) => { - return ( - props.nav.navigate(props.where, {}) }> - - - ); -} - -const TrayJsx = (props) => { - const nav = props.navigation; - const [state, setState] = useState({ - unreadNotifications: false - }); - - useEffect(() => { - checkUnreadNotifications() - .then(isUnread => { - setState({...state, - unreadNotifications: isUnread, - }); - }); - }, []); - - return ( - - - - - - - - - - ); -}; - -const SCREEN_WIDTH = Dimensions.get("window").width; -const styles = { - tray: { - width: SCREEN_WIDTH, - paddingTop: 15, - paddingBottom: 15, - - borderTopWidth: 2, - borderTopColor: "#CCC", - backgroundColor: "white" - }, - iconList: { - flexDirection: "row", - justifyContent: "space-evenly", - alignItems: "center", - - margin: 0, - paddingLeft: 0, - }, -}; - -export default TrayJsx; diff --git a/src/components/pages/authenticate.js b/src/components/pages/authenticate.js index ca71447..e80db5c 100644 --- a/src/components/pages/authenticate.js +++ b/src/components/pages/authenticate.js @@ -16,7 +16,7 @@ import Constants from "expo-constants"; import * as requests from "src/requests"; -const AuthenticateJsx = ({navigation}) => { +const Authenticate = ({navigation}) => { const REDIRECT_URI = Linking.makeUrl("authenticate"); const [state, setState] = useState({ instance: "", @@ -83,7 +83,7 @@ const AuthenticateJsx = ({navigation}) => { ); // Since nothing went wrong, navigate to the feed. - navigation.navigate("Feed"); + navigation.replace("Main"); }; const _handleUrl = async ({ url }) => { @@ -136,7 +136,7 @@ const AuthenticateJsx = ({navigation}) => { ], ]); - navigation.navigate("Feed"); + navigation.replace("Main"); }; useEffect(() => { @@ -265,4 +265,4 @@ const styles = { }, }; -export { AuthenticateJsx as default }; +export { Authenticate as default }; diff --git a/src/components/pages/direct.js b/src/components/pages/direct.js index e9db938..5248486 100644 --- a/src/components/pages/direct.js +++ b/src/components/pages/direct.js @@ -14,8 +14,7 @@ import * as requests from "src/requests"; import { Ionicons } from "@expo/vector-icons"; -import { ScreenWithTrayJsx } from "src/components/navigation/navigators"; -import ModerateMenuJsx from "src/components/moderate-menu.js"; +import ModerateMenu from "src/components/moderate-menu.js"; const TEST_IMAGE_1 = "https://cache.desktopnexus.com/thumbseg/2255/2255124-bigthumbnail.jpg"; const TEST_IMAGE_2 = "https://natureproducts.net/Forest_Products/Cutflowers/Musella_cut.jpg"; @@ -37,7 +36,7 @@ function filterConversations(convs, query) { }); } -const DirectJsx = ({ navigation }) => { +const Direct = ({ navigation }) => { const FETCH_LIMIT = 1; const [state, setState] = useState({ @@ -133,7 +132,7 @@ const DirectJsx = ({ navigation }) => { - @@ -141,9 +140,7 @@ const DirectJsx = ({ navigation }) => { }; return ( - + <> { state.loaded ? <> @@ -188,7 +185,7 @@ const DirectJsx = ({ navigation }) => { : <> } - + ); }; @@ -259,4 +256,4 @@ const styles = { bold: { fontWeight: "bold" }, }; -export { DirectJsx as default }; +export { Direct as default }; diff --git a/src/components/pages/direct/conversation.js b/src/components/pages/direct/conversation.js index e228ff8..a128620 100644 --- a/src/components/pages/direct/conversation.js +++ b/src/components/pages/direct/conversation.js @@ -24,7 +24,6 @@ import { const { SlideInMenu } = renderers; -import BackBarJsx from "src/components/navigation/back-bar"; import { timeToAge, StatusBarSpace } from "src/interface/rendering"; const TEST_IMAGE_1 = "https://cache.desktopnexus.com/thumbseg/2255/2255124-bigthumbnail.jpg"; @@ -46,12 +45,12 @@ const TEST_MESSAGES = [ { ...TEST_STATUS, id: 5 }, ]; -const ConversationContainerJsx = (props) => ( +const ConversationContainer = (props) => ( - + { props.renderBackBar() } - + { props.children } @@ -80,7 +79,7 @@ const ConversationContainerJsx = (props) => ( ); -const ComposeJsx = ({ navigation }) => { +const Compose = ({ navigation }) => { const [state, setState] = useState({ accts: [], newMessage: "", @@ -98,7 +97,7 @@ const ComposeJsx = ({ navigation }) => { }/> ); - return { }/>; }; -const ConversationJsx = ({ navigation }) => { +const Conversation = ({ navigation }) => { const conversation = navigation.getParam("conversation", {}); const [state, setState] = useState({ loaded: false, @@ -227,7 +226,7 @@ const ConversationJsx = ({ navigation }) => { }; return ( - { ? state.messages.map(renderMessage) : <> } - + ); }; @@ -327,4 +326,4 @@ const styles = { }, }; -export { ConversationJsx as default, ComposeJsx, }; +export { Conversation as default, Compose, }; diff --git a/src/components/pages/discover.js b/src/components/pages/discover.js index c5bbf32..1f3db1f 100644 --- a/src/components/pages/discover.js +++ b/src/components/pages/discover.js @@ -8,12 +8,11 @@ import AsyncStorage from "@react-native-async-storage/async-storage"; import * as requests from "src/requests"; -import PagedGridJsx from "src/components/posts/paged-grid"; -import { ScreenWithTrayJsx } from "src/components/navigation/navigators"; +import PagedGrid from "src/components/posts/paged-grid"; import { TouchableWithoutFeedback } from "react-native-gesture-handler"; -const DiscoverJsx = (props) => { +const Discover = (props) => { const POST_FETCH_PARAMS = { only_media: true, limit: 18, @@ -103,7 +102,7 @@ const DiscoverJsx = (props) => { }; const LocalTimeline = () => ( - { ); const FederatedTimeline = () => ( - { return ( <> { state.loaded - ? + ? <> props.navigation.navigate("Search") }> @@ -163,7 +159,7 @@ const DiscoverJsx = (props) => { renderTabBar = { renderTabBar } onIndexChange = { setIndex } initialLayout = { { width: SCREEN_WIDTH } } /> - + : <> } @@ -191,4 +187,4 @@ const styles = { }, }; -export default DiscoverJsx; +export default Discover; diff --git a/src/components/pages/discover/search.js b/src/components/pages/discover/search.js index 4fe9971..279b6ac 100644 --- a/src/components/pages/discover/search.js +++ b/src/components/pages/discover/search.js @@ -12,7 +12,6 @@ import AsyncStorage from "@react-native-async-storage/async-storage"; import * as requests from "src/requests"; import { StatusBarSpace } from "src/interface/rendering"; -import { ScreenWithTrayJsx } from "src/components/navigation/navigators"; import { TouchableOpacity } from "react-native-gesture-handler"; @@ -22,7 +21,7 @@ function navCallbackFactory(navigation, route) { } } -const SearchJsx = ({navigation}) => { +const Search = ({navigation}) => { // The number of additional items to fetch each time const FETCH_LIMIT = 5; @@ -122,7 +121,7 @@ const SearchJsx = ({navigation}) => { ]); const AccountRenderer = () => ( - { ); const HashtagRenderer = () => ( - { return ( <> { state.loaded - ? + ? <> { initialLayout = { { width: SCREEN_WIDTH } } /> : <> } - + : <> } ); }; -const SearchItemJsx = (props) => { +const SearchItem = (props) => { return ( props.callback(props.navParams) }> @@ -222,22 +218,22 @@ const SearchItemJsx = (props) => { }; // Display message noting when no results turned up. This component wraps -// AccountListJsx and HashtagListJsx. -const SearchListContainerJsx = ({ results, children }) => results.length == 0 +// AccountList and HashtagList. +const SearchListContainer = ({ results, children }) => results.length == 0 ? No results! : children; -const AccountListJsx = (props) => { +const AccountList = (props) => { return ( - + <> { props.results.map(item => { return ( - { { item.display_name } - + ); }) } @@ -267,19 +263,19 @@ const AccountListJsx = (props) => { } - + ); }; -const HashtagListJsx = (props) => { +const HashtagList = (props) => { return ( - + <> { props.results.map((item, i) => { return ( - { #{ item.name } - + ); }) } @@ -306,7 +302,7 @@ const HashtagListJsx = (props) => { } - + ); } @@ -388,4 +384,4 @@ const styles = { }, } -export default SearchJsx; +export default Search; diff --git a/src/components/pages/discover/view-hashtag.js b/src/components/pages/discover/view-hashtag.js index c13a153..d9f422e 100644 --- a/src/components/pages/discover/view-hashtag.js +++ b/src/components/pages/discover/view-hashtag.js @@ -1,12 +1,11 @@ import React, { useState, useEffect } from "react"; import { View, Image, Dimensions, Text } from "react-native"; -import { ScreenWithBackBarJsx } from "src/components/navigation/navigators"; -import PagedGridJsx from "src/components/posts/paged-grid"; +import PagedGrid from "src/components/posts/paged-grid"; import * as requests from "src/requests"; import AsyncStorage from "@react-native-async-storage/async-storage"; -const ViewHashtagJsx = ({navigation}) => { +const ViewHashtag = ({navigation}) => { const FETCH_LIMIT = 18; let [state, setState] = useState({ tag: navigation.getParam("tag", null), @@ -70,7 +69,7 @@ const ViewHashtagJsx = ({navigation}) => { const latest = state.tag.history[0]; return ( - + <> @@ -106,7 +105,7 @@ const ViewHashtagJsx = ({navigation}) => { <> { state.loaded && state.posts.length > 0 - ? @@ -116,7 +115,7 @@ const ViewHashtagJsx = ({navigation}) => { } - + ); }; @@ -149,4 +148,4 @@ const styles = { }, } -export default ViewHashtagJsx; +export default ViewHashtag; diff --git a/src/components/pages/feed.js b/src/components/pages/feed.js index 8a3ab50..11808d6 100644 --- a/src/components/pages/feed.js +++ b/src/components/pages/feed.js @@ -1,16 +1,16 @@ import React, { useState, useEffect } from "react"; -import { Dimensions, View, Image, Text } from "react-native"; +import { ScrollView, Dimensions, View, Image, Text } from "react-native"; import { Ionicons } from '@expo/vector-icons'; -import TimelineViewJsx from "src/components/posts/timeline-view"; -import { ScreenWithTrayJsx } from "src/components/navigation/navigators"; +import TimelineView from "src/components/posts/timeline-view"; import { TouchableWithoutFeedback } from "react-native-gesture-handler"; import AsyncStorage from "@react-native-async-storage/async-storage"; import * as requests from "src/requests"; +import { StatusBarSpace } from "src/interface/rendering"; -const FeedJsx = (props) => { +const Feed = (props) => { const [state, setState] = useState({ loaded: false, postsRendered: false, @@ -69,13 +69,13 @@ const FeedJsx = (props) => { }); let endOfTimelineMessage = <>; - if (state.postsRendered) { + if (state.postsRendered || state.loaded && state.posts.length == 0) { // Only render the timeline interruption if all of the posts have been // rendered in the feed. endOfTimelineMessage = <> @@ -88,7 +88,7 @@ const FeedJsx = (props) => { You're all caught up. Wow, it sure is a lovely day outside 🌳 - + { return ( <> + { state.loaded - ? - - - { endOfTimelineMessage } - + ? state.posts.length > 0 + ? + + { endOfTimelineMessage } + + : endOfTimelineMessage : <> } @@ -161,4 +156,4 @@ const styles = { }, }; -export default FeedJsx; +export default Feed; diff --git a/src/components/pages/feed/older-posts.js b/src/components/pages/feed/older-posts.js index fdaf70a..8235483 100644 --- a/src/components/pages/feed/older-posts.js +++ b/src/components/pages/feed/older-posts.js @@ -2,13 +2,12 @@ import React, { useState, useEffect } from "react"; import AsyncStorage from "@react-native-async-storage/async-storage"; import * as requests from "src/requests"; -import { ScreenWithBackBarJsx } from "src/components/navigation/navigators"; -import PagedGridJsx from "src/components/posts/paged-grid"; +import PagedGrid from "src/components/posts/paged-grid"; // The number of posts to fetch at a time const POST_FETCH_LIMIT = 18; -const OlderPostsJsx = (props) => { +const OlderPosts = (props) => { const [ state, setState ] = useState({ loaded: false, }); @@ -59,16 +58,16 @@ const OlderPostsJsx = (props) => { return ( <> { state.loaded - ? - + - + : <> } ); }; -export default OlderPostsJsx; +export default OlderPosts; diff --git a/src/components/pages/profile.js b/src/components/pages/profile.js index ce83594..dc4688a 100644 --- a/src/components/pages/profile.js +++ b/src/components/pages/profile.js @@ -16,14 +16,10 @@ import HTML from "react-native-render-html"; import { withLeadingAcct, withoutHTML, pluralize } from "src/interface/rendering"; import * as requests from "src/requests"; -import GridViewJsx from "src/components/posts/grid-view"; -import { - ScreenWithTrayJsx, - ScreenWithBackBarJsx, -} from "src/components/navigation/navigators"; +import GridView from "src/components/posts/grid-view"; import { MenuOption } from "react-native-popup-menu"; -import ContextMenuJsx from "src/components/context-menu.js"; +import ContextMenu from "src/components/context-menu.js"; function getMutuals(yourFollowing, theirFollowers) { // Where yours and theirs are arrays of followers, as returned by the API @@ -60,7 +56,7 @@ const HTMLLink = ({link}) => { } } -const ViewProfileJsx = ({navigation}) => { +const ViewProfile = ({navigation}) => { // As rendered when opened from somewhere other than the tab bar const [state, setState] = useState({ loaded: false, @@ -163,10 +159,10 @@ const ViewProfileJsx = ({navigation}) => { return ( <> { state.loaded - ? active = { navigation.getParam("originTab") } navigation = { navigation }> - { listedUsers = { state.listedUsers } followed = { state.followed } posts = { state.posts }/> - + : <> } ); } -const ProfileJsx = ({ navigation }) => { +const Profile = ({ navigation }) => { const [state, setState] = useState({ loaded: false, }); @@ -230,25 +226,22 @@ const ProfileJsx = ({ navigation }) => { return ( <> { state.loaded - ? - + - + : <> } ) }; -const RawProfileJsx = (props) => { +const RawProfile = (props) => { let profileButton; /* Some profiles won't have a note, and react-native-render-html will @@ -317,7 +310,7 @@ const RawProfileJsx = (props) => { { !props.own - ? @@ -330,7 +323,7 @@ const RawProfileJsx = (props) => { - + : <> } @@ -389,7 +382,7 @@ const RawProfileJsx = (props) => { {profileButton} - @@ -470,4 +463,4 @@ const styles = { }, }; -export { ViewProfileJsx, ProfileJsx as default }; +export { ViewProfile, Profile as default }; diff --git a/src/components/pages/profile/notifications.js b/src/components/pages/profile/notifications.js index 31d1d7c..c9fbecc 100644 --- a/src/components/pages/profile/notifications.js +++ b/src/components/pages/profile/notifications.js @@ -11,8 +11,6 @@ import { FontAwesome } from "@expo/vector-icons"; import AsyncStorage from "@react-native-async-storage/async-storage"; -import { ScreenWithBackBarJsx } from "src/components/navigation/navigators"; - const TEST_IMAGE = "https://cache.desktopnexus.com/thumbseg/2255/2255124-bigthumbnail.jpg"; const TEST_NOTIFICATIONS = [ { @@ -139,32 +137,32 @@ function navigatePostFactory(nav, id) { function renderNotification(notif, navigation) { switch(notif.type) { case "follow": - return case "follow_request": - return case "mention": - return case "reblog": - return case "favourite": - return case "status": - return @@ -174,7 +172,7 @@ function renderNotification(notif, navigation) { } } -const UserTextJsx = (props) => { +const UserText = (props) => { return ( { ); }; -const NotificationJsx = (props) => { +const Notification = (props) => { return ( @@ -223,25 +221,25 @@ const NotificationJsx = (props) => { ); }; -const FollowJsx = (props) => { +const Follow = (props) => { return ( - - + has followed you. - + ); }; -const FollowRequestJsx = (props) => { +const FollowRequest = (props) => { return ( - { buttonLabel = { "Accept" } buttonCallback = { () => console.log("Request accepted") }> - + has requested to follow you. - + ); }; -const MentionJsx = (props) => { +const Mention = (props) => { let uri; let imageStyle; let thumbnailCallback; @@ -282,24 +280,24 @@ const MentionJsx = (props) => { } return ( - - + mentioned you: "{ props.data.status.content }" - + ); }; -const ReblogJsx = (props) => { +const Reblog = (props) => { return ( - { size = { 20 } style = { styles.notif.inlineIcon }/> - + shared your post. - + ); }; -const FavouriteJsx = (props) => { +const Favourite = (props) => { return ( - { color = "black" style = { styles.notif.inlineIcon }/> - + liked your post. - + ); }; -const StatusJsx = (props) => { +const Status = (props) => { return ( - - + just posted. - + ); }; -const NotificationsJsx = ({navigation}) => { +const Notifications = ({navigation}) => { const [state, setState] = useState({ loaded: false, }); @@ -378,7 +376,7 @@ const NotificationsJsx = ({navigation}) => { }, []); return ( - navigation = { navigation }> { state.loaded ? @@ -390,7 +388,7 @@ const NotificationsJsx = ({navigation}) => { : <> } - + ); } @@ -439,4 +437,4 @@ const styles = { bold: { fontWeight: "bold" }, }; -export default NotificationsJsx; +export default Notifications; diff --git a/src/components/pages/profile/settings.js b/src/components/pages/profile/settings.js index 89131d2..23b2174 100644 --- a/src/components/pages/profile/settings.js +++ b/src/components/pages/profile/settings.js @@ -19,9 +19,7 @@ import * as ImagePicker from 'expo-image-picker'; import { withoutHTML } from "src/interface/rendering"; -import { ScreenWithBackBarJsx } from "src/components/navigation/navigators"; - -const SettingsJsx = (props) => { +const Settings = (props) => { const [state, setState] = useState({ loaded: false, }); @@ -136,7 +134,7 @@ const SettingsJsx = (props) => { return ( <> { state.loaded - ? + ? <> { - + : <> } @@ -289,4 +287,4 @@ const styles = { }, }; -export default SettingsJsx; +export default Settings; diff --git a/src/components/pages/publish.js b/src/components/pages/publish.js index e88617e..ad7b84a 100644 --- a/src/components/pages/publish.js +++ b/src/components/pages/publish.js @@ -9,7 +9,6 @@ import { import { Ionicons } from '@expo/vector-icons'; import { getAutoHeight } from "src/interface/rendering"; -import { ScreenWithTrayJsx } from "src/components/navigation/navigators"; import { TouchableOpacity } from "react-native-gesture-handler"; import mime from "mime"; @@ -18,7 +17,7 @@ import * as Permissions from "expo-permissions"; import AsyncStorage from "@react-native-async-storage/async-storage"; import * as requests from "src/requests"; -const PublishJsx = ({ navigation }) => { +const Publish = ({ navigation }) => { const [ state, setState ] = useState({ loaded: false, }); @@ -131,9 +130,7 @@ const PublishJsx = ({ navigation }) => { return ( <> { state.loaded - ? + ? <> { - + : <> } @@ -243,4 +240,4 @@ const styles = { }, }; -export { PublishJsx as default }; +export { Publish as default }; diff --git a/src/components/pages/user-list.js b/src/components/pages/user-list.js index d935fbb..519e814 100644 --- a/src/components/pages/user-list.js +++ b/src/components/pages/user-list.js @@ -8,15 +8,14 @@ import { TouchableOpacity, } from "react-native"; -import { ScreenWithBackBarJsx } from "src/components/navigation/navigators.js"; -import ModerateMenuJsx from "src/components/moderate-menu.js"; +import ModerateMenu from "src/components/moderate-menu.js"; -const UserListJsx = ({navigation}) => { +const UserList = ({navigation}) => { const data = navigation.getParam("data", []) const context = navigation.getParam("context", ""); return ( - + <> { context ? @@ -50,13 +49,13 @@ const UserListJsx = ({navigation}) => { - ) } - + ); }; @@ -100,4 +99,4 @@ const styles = { }, }; -export { UserListJsx as default }; +export { UserList as default }; diff --git a/src/components/pages/view-comments.js b/src/components/pages/view-comments.js index 396b9b1..d6878d1 100644 --- a/src/components/pages/view-comments.js +++ b/src/components/pages/view-comments.js @@ -19,8 +19,7 @@ import { } from "src/interface/rendering"; import { activeOrNot } from "src/interface/interactions"; -import TimelineViewJsx from "src/components/posts/timeline-view"; -import BackBarJsx from "src/components/navigation/back-bar"; +import TimelineView from "src/components/posts/timeline-view"; import { TouchableOpacity } from "react-native-gesture-handler"; import * as requests from "src/requests"; @@ -124,7 +123,7 @@ function threadify(descendants) { return sorted; } -const CommentJsx = (props) => { +const Comment = (props) => { const menuOptionsStyles = { optionWrapper: { // The wrapper around a single option paddingLeft: SCREEN_WIDTH / 15, @@ -234,13 +233,14 @@ const CommentJsx = (props) => { ); } -const ViewCommentsJsx = (props) => { +const ViewComments = (props) => { let [state, setState] = useState({ - postData: props.navigation.getParam("postData", null), loaded: false, reply: "", }); + const postData = props.route.params.postData; + useEffect(() => { let profile, instance, accessToken; AsyncStorage @@ -254,7 +254,7 @@ const ViewCommentsJsx = (props) => { accessToken = JSON.parse(tokenPair[1]).access_token; return requests - .fetchStatusContext(instance, state.postData.id, accessToken) + .fetchStatusContext(instance, postData.id, accessToken) }) .then(context => { setState({...state, @@ -263,8 +263,8 @@ const ViewCommentsJsx = (props) => { instance, accessToken, inReplyTo: { - acct: state.postData.account.acct, - id: state.postData.id, + acct: postData.account.acct, + id: postData.id, }, loaded: true, }); @@ -275,7 +275,7 @@ const ViewCommentsJsx = (props) => { // Fetch an updated context to rerender the page const { descendants } = await requests.fetchStatusContext( state.instance, - state.postData.id, + postData.id, state.accessToken, ); @@ -291,7 +291,7 @@ const ViewCommentsJsx = (props) => { * Returns a new collection of threads without the comment with the * given id */ - + return state.descendants.map(thread => thread.filter(comment => comment.id != id) ).filter(thread => thread.length > 0); @@ -351,8 +351,8 @@ const ViewCommentsJsx = (props) => { const _handleCancelSubReply = () => { setState({...state, inReplyTo: { - acct: state.postData.account.acct, - id: state.postData.id, + acct: postData.account.acct, + id: postData.id, }, }); }; @@ -371,8 +371,8 @@ const ViewCommentsJsx = (props) => { setState({...state, // Reset the comment form inReplyTo: { - acct: state.postData.account.acct, - id: state.postData.id, + acct: postData.account.acct, + id: postData.id, }, reply: "", @@ -383,7 +383,7 @@ const ViewCommentsJsx = (props) => { }; const PartialComment = (props) => ( - { <> { state.loaded ? - - { state.loaded ? + data = { postData } /> { state.descendants.length != 0 @@ -443,7 +441,7 @@ const ViewCommentsJsx = (props) => { <> - { state.inReplyTo.id != state.postData.id + { state.inReplyTo.id != postData.id ? @@ -582,4 +580,4 @@ const styles = { }, }; -export default ViewCommentsJsx; +export default ViewComments; diff --git a/src/components/pages/view-post.js b/src/components/pages/view-post.js index 4d0c63b..540369f 100644 --- a/src/components/pages/view-post.js +++ b/src/components/pages/view-post.js @@ -1,32 +1,20 @@ -import React, { useState, useEffect } from "react"; +import React from "react"; +import { ScrollView } from "react-native"; -import { ScreenWithBackBarJsx } from "src/components/navigation/navigators"; -import { PostByDataJsx } from "src/components/posts/post"; +import { PostByData } from "src/components/posts/post"; -const ViewPostJsx = ({navigation}) => { - const [state, setState] = useState({ - post: navigation.getParam("post", null), - loaded: false, - }); +const ViewPost = ({ navigation, route }) => ( + + navigation.goBack() + } + afterModerate = { + () => navigation.goBack() + } + data = { route.params.post } /> + +) - if (state.post == null) { - throw Error("Post not given when navigating to ViewPost!"); - } - - return ( - - navigation.goBack() - } - afterModerate = { - () => navigation.goBack() - } - data = { state.post } /> - - ); -} - -export default ViewPostJsx; +export default ViewPost; diff --git a/src/components/posts/grid-view.js b/src/components/posts/grid-view.js index d925ba6..bf3a5a4 100644 --- a/src/components/posts/grid-view.js +++ b/src/components/posts/grid-view.js @@ -16,7 +16,7 @@ function partition(arr, size) { return newArray } -const GridPostJsx = (props) => { +const GridPost = (props) => { return ( { @@ -33,7 +33,7 @@ const GridPostJsx = (props) => { ) } -const GridViewJsx = (props) => { +const GridView = (props) => { // Ensure only posts with media get into the grid const postsWithMedia = props.posts.filter( p => p.media_attachments != null @@ -52,7 +52,7 @@ const GridViewJsx = (props) => { row.map((post) => { return ( - @@ -80,4 +80,4 @@ const styles = { }, }; -export default GridViewJsx; +export default GridView; diff --git a/src/components/posts/paged-grid.js b/src/components/posts/paged-grid.js index cab3627..fbde599 100644 --- a/src/components/posts/paged-grid.js +++ b/src/components/posts/paged-grid.js @@ -1,7 +1,7 @@ import React, { useState, useEffect } from "react"; import { View, TouchableOpacity, Text } from "react-native"; -import GridViewJsx from "src/components/posts/grid-view"; +import GridView from "src/components/posts/grid-view"; const TEST_IMAGE = "https://cache.desktopnexus.com/thumbseg/2255/2255124-bigthumbnail.jpg"; const TEST_POSTS = [ @@ -34,7 +34,7 @@ const TEST_POSTS = [ const PagedGridJSX = (props) => { return ( - { +const PostAction = (props) => { return ( @@ -28,7 +28,7 @@ const PostActionJsx = (props) => { ) } -const PostActionBarJsx = (props) => { +const PostActionBar = (props) => { const icons = { heart: { active: "heart", @@ -45,17 +45,17 @@ const PostActionBarJsx = (props) => { } return ( - - - @@ -71,4 +71,4 @@ const styles = { }, } -export default PostActionBarJsx; +export default PostActionBar; diff --git a/src/components/posts/post.js b/src/components/posts/post.js index 26f899c..b4cb6ac 100644 --- a/src/components/posts/post.js +++ b/src/components/posts/post.js @@ -20,13 +20,12 @@ import AsyncStorage from "@react-native-async-storage/async-storage"; import * as requests from "src/requests"; import { withLeadingAcct } from "src/interface/rendering"; -import PostActionBarJsx from "src/components/posts/post-action-bar"; +import PostActionBar from "src/components/posts/post-action-bar"; import { MenuOption } from "react-native-popup-menu"; -import ContextMenuJsx from "src/components/context-menu.js"; +import ContextMenu from "src/components/context-menu.js"; const SCREEN_WIDTH = Dimensions.get("window").width; -const TEST_IMAGE = "https://cache.desktopnexus.com/thumbseg/2255/2255124-bigthumbnail.jpg"; function getDimensionsPromises(uris) { return uris.map(attachment => new Promise(resolve => { @@ -52,19 +51,18 @@ function handleFavouriteFactory(state, setState) { }; } -const PostImageJsx = (props) => { +const PostImage = (props) => { return }; -export const RawPostJsx = (props) => { +export const RawPost = (props) => { const repliesCount = props.data.replies_count; let commentsText; @@ -95,7 +93,7 @@ export const RawPostJsx = (props) => { { props.data.account.acct } - { props.own @@ -116,7 +114,7 @@ export const RawPostJsx = (props) => { text = "Block" /> } - + { props.data.media_attachments.length > 1 ? @@ -129,7 +127,7 @@ export const RawPostJsx = (props) => { { props.data.media_attachments .map((attachment, i) => { - return ( { }) } - : } - { props.navigation.navigate("ViewComments", { - originTab: props.navigation.getParam("originTab"), postData: props.data }) }> @@ -178,7 +175,7 @@ export const RawPostJsx = (props) => { ); } -export const PostByDataJsx = (props) => { +export const PostByData = (props) => { /* * Renders a post where the data is supplied directly to the element through * its properties, as it is in a timeline. @@ -211,7 +208,7 @@ export const PostByDataJsx = (props) => { ) .then(dimensions => { setState({...state, - dimensions: dimensions, + dimensions, instance, accessToken, own, @@ -284,7 +281,6 @@ export const PostByDataJsx = (props) => { state.accessToken ); } - console.warn(newStatus.bookmarked); setState({...state, data: newStatus, @@ -350,7 +346,7 @@ export const PostByDataJsx = (props) => { return ( { state.loaded && !state.deleted ? - { onBlock = { _handleBlock } own = { state.own } navigation = { props.navigation }/> - : } + : <> } ); } diff --git a/src/components/posts/timeline-view.js b/src/components/posts/timeline-view.js index 71cedce..208603f 100644 --- a/src/components/posts/timeline-view.js +++ b/src/components/posts/timeline-view.js @@ -1,9 +1,9 @@ import React, { useState, useEffect } from "react"; import { View } from "react-native"; -import { PostByDataJsx } from "src/components/posts/post"; +import { PostByData } from "src/components/posts/post"; -const TimelineViewJsx = (props) => { +const TimelineView = (props) => { // Count the number of posts that have already loaded const [postsLoaded, setPostsLoaded] = useState(0); @@ -30,7 +30,7 @@ const TimelineViewJsx = (props) => { { props.posts.map((post, i) => { return ( - @@ -41,4 +41,4 @@ const TimelineViewJsx = (props) => { ); }; -export default TimelineViewJsx; +export default TimelineView;