diff --git a/README.md b/README.md index 2133d9c6..64ffe5da 100644 --- a/README.md +++ b/README.md @@ -29,7 +29,7 @@ Uses: - Web: `yarn web` - Tips - `npx react-native info` Checks what has been installed. - - On M1 macs, you need to exclude "arm64" from the target architectures + - On M1 macs, [you need to exclude "arm64" from the target architectures](https://stackoverflow.com/a/65399525) - Annoyingly this must be re-set via XCode after every pod install - The android simulator won't be able to access localhost services unless you run `adb reverse tcp:{PORT} tcp:{PORT}` - For instance, the localhosted dev-wallet will need `adb reverse tcp:3001 tcp:3001` diff --git a/ios/Podfile.lock b/ios/Podfile.lock index 8be1857f..9d373af9 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -296,6 +296,8 @@ PODS: - RNScreens (3.13.1): - React-Core - React-RCTImage + - RNSVG (12.4.0): + - React-Core - Yoga (1.14.0) DEPENDENCIES: @@ -335,6 +337,7 @@ DEPENDENCIES: - "RNCAsyncStorage (from `../node_modules/@react-native-async-storage/async-storage`)" - RNInAppBrowser (from `../node_modules/react-native-inappbrowser-reborn`) - RNScreens (from `../node_modules/react-native-screens`) + - RNSVG (from `../node_modules/react-native-svg`) - Yoga (from `../node_modules/react-native/ReactCommon/yoga`) SPEC REPOS: @@ -410,6 +413,8 @@ EXTERNAL SOURCES: :path: "../node_modules/react-native-inappbrowser-reborn" RNScreens: :path: "../node_modules/react-native-screens" + RNSVG: + :path: "../node_modules/react-native-svg" Yoga: :path: "../node_modules/react-native/ReactCommon/yoga" @@ -449,6 +454,7 @@ SPEC CHECKSUMS: RNCAsyncStorage: 466b9df1a14bccda91da86e0b7d9a345d78e1673 RNInAppBrowser: 3ff3a3b8f458aaf25aaee879d057352862edf357 RNScreens: 40a2cb40a02a609938137a1e0acfbf8fc9eebf19 + RNSVG: 3dd44d99d1c18e1342aee4bfa53ab3f6a8c4865f Yoga: 99652481fcd320aefa4a7ef90095b95acd181952 PODFILE CHECKSUM: cf94853ebcb0d8e0d027dca9ab7a4ede886a8f20 diff --git a/ios/app.xcodeproj/project.pbxproj b/ios/app.xcodeproj/project.pbxproj index 06ea7c61..5adf1695 100644 --- a/ios/app.xcodeproj/project.pbxproj +++ b/ios/app.xcodeproj/project.pbxproj @@ -463,6 +463,7 @@ CURRENT_PROJECT_VERSION = 1; DEVELOPMENT_TEAM = A6GRZHF6BV; ENABLE_BITCODE = NO; + "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = arm64; INFOPLIST_FILE = app/Info.plist; LD_RUNPATH_SEARCH_PATHS = ( "$(inherited)", @@ -490,6 +491,7 @@ CODE_SIGN_ENTITLEMENTS = app/app.entitlements; CURRENT_PROJECT_VERSION = 1; DEVELOPMENT_TEAM = A6GRZHF6BV; + "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = arm64; INFOPLIST_FILE = app/Info.plist; LD_RUNPATH_SEARCH_PATHS = ( "$(inherited)", @@ -540,7 +542,7 @@ COPY_PHASE_STRIP = NO; ENABLE_STRICT_OBJC_MSGSEND = YES; ENABLE_TESTABILITY = YES; - "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = arm64; + "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = ""; GCC_C_LANGUAGE_STANDARD = gnu99; GCC_DYNAMIC_NO_PIC = NO; GCC_NO_COMMON_BLOCKS = YES; @@ -611,7 +613,7 @@ COPY_PHASE_STRIP = YES; ENABLE_NS_ASSERTIONS = NO; ENABLE_STRICT_OBJC_MSGSEND = YES; - "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = arm64; + "EXCLUDED_ARCHS[sdk=iphonesimulator*]" = ""; GCC_C_LANGUAGE_STANDARD = gnu99; GCC_NO_COMMON_BLOCKS = YES; GCC_WARN_64_TO_32_BIT_CONVERSION = YES; diff --git a/package.json b/package.json index 7c87b38e..6474e965 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,10 @@ "@adxp/auth": "*", "@adxp/common": "*", "@adxp/mock-api": "git+ssh://git@github.com:bluesky-social/adx-mock-api.git#74a1f810a342aa4b58a54724e21c57d2faa5e72e", + "@fortawesome/fontawesome-svg-core": "^6.1.1", + "@fortawesome/free-regular-svg-icons": "^6.1.1", + "@fortawesome/free-solid-svg-icons": "^6.1.1", + "@fortawesome/react-native-fontawesome": "^0.3.0", "@react-native-async-storage/async-storage": "^1.17.6", "@react-navigation/bottom-tabs": "^6.3.1", "@react-navigation/native": "^6.0.10", @@ -32,6 +36,7 @@ "react-native-inappbrowser-reborn": "^3.6.3", "react-native-safe-area-context": "^4.3.1", "react-native-screens": "^3.13.1", + "react-native-svg": "^12.4.0", "react-native-url-polyfill": "^1.3.0", "react-native-web": "^0.17.7", "ucans": "0.9.1" diff --git a/src/App.native.tsx b/src/App.native.tsx index 071b7457..ffeb7d5f 100644 --- a/src/App.native.tsx +++ b/src/App.native.tsx @@ -1,31 +1,10 @@ import 'react-native-url-polyfill/auto' import React, {useState, useEffect} from 'react' -import moment from 'moment' import {whenWebCrypto} from './platform/polyfills.native' +import * as view from './view/index' import {RootStoreModel, setupState, RootStoreProvider} from './state' import * as Routes from './view/routes' -moment.updateLocale('en', { - relativeTime: { - future: 'in %s', - past: '%s ago', - s: 'a few seconds', - ss: '%ds', - m: 'a minute', - mm: '%dm', - h: 'an hour', - hh: '%dh', - d: 'a day', - dd: '%dd', - w: 'a week', - ww: '%dw', - M: 'a month', - MM: '%dmo', - y: 'a year', - yy: '%dy', - }, -}) - function App() { const [rootStore, setRootStore] = useState( undefined, @@ -33,7 +12,12 @@ function App() { // init useEffect(() => { - whenWebCrypto.then(() => setupState()).then(setRootStore) + whenWebCrypto + .then(() => { + view.setup() + return setupState() + }) + .then(setRootStore) }, []) // show nothing prior to init diff --git a/src/App.web.tsx b/src/App.web.tsx index a6f98487..018ac400 100644 --- a/src/App.web.tsx +++ b/src/App.web.tsx @@ -1,29 +1,8 @@ import React, {useState, useEffect} from 'react' -import moment from 'moment' +import * as view from './view/index' import {RootStoreModel, setupState, RootStoreProvider} from './state' import * as Routes from './view/routes' -moment.updateLocale('en', { - relativeTime: { - future: 'in %s', - past: '%s ago', - s: 'a few seconds', - ss: '%ds', - m: 'a minute', - mm: '%dm', - h: 'an hour', - hh: '%dh', - d: 'a day', - dd: '%dd', - w: 'a week', - ww: '%dw', - M: 'a month', - MM: '%dmo', - y: 'a year', - yy: '%dy', - }, -}) - function App() { const [rootStore, setRootStore] = useState( undefined, @@ -31,6 +10,7 @@ function App() { // init useEffect(() => { + view.setup() setupState().then(setRootStore) }, []) diff --git a/src/view/com/FeedItem.tsx b/src/view/com/FeedItem.tsx index 8f838d5d..262104bf 100644 --- a/src/view/com/FeedItem.tsx +++ b/src/view/com/FeedItem.tsx @@ -3,6 +3,7 @@ import {observer} from 'mobx-react-lite' import {Text, Image, ImageSourcePropType, StyleSheet, View} from 'react-native' import {bsky} from '@adxp/mock-api' import moment from 'moment' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {FeedViewItemModel} from '../../state/models/feed-view' const IMAGES: Record = { @@ -20,9 +21,12 @@ export const FeedItem = observer(function FeedItem({ return ( {item.repostedBy && ( - - Reposted by {item.repostedBy.displayName} - + + + + Reposted by {item.repostedBy.displayName} + + )} @@ -44,6 +48,36 @@ export const FeedItem = observer(function FeedItem({ {record.text} + + + + {item.replyCount} + + + + {item.repostCount} + + + + {item.likeCount} + + + + + @@ -58,7 +92,14 @@ const styles = StyleSheet.create({ padding: 10, }, repostedBy: { + flexDirection: 'row', paddingLeft: 70, + }, + repostedByIcon: { + marginRight: 2, + color: 'gray', + }, + repostedByText: { color: 'gray', fontWeight: 'bold', fontSize: 13, @@ -100,5 +141,32 @@ const styles = StyleSheet.create({ }, postText: { fontSize: 15, + paddingBottom: 5, + }, + ctrls: { + flexDirection: 'row', + }, + ctrl: { + flexDirection: 'row', + alignItems: 'center', + flex: 1, + paddingLeft: 4, + paddingRight: 4, + }, + ctrlReplyIcon: { + marginRight: 5, + color: 'gray', + }, + ctrlRepostIcon: { + marginRight: 5, + color: 'gray', + }, + ctrlLikeIcon: { + marginRight: 5, + color: 'gray', + }, + ctrlShareIcon: { + marginRight: 5, + color: 'gray', }, }) diff --git a/src/view/index.ts b/src/view/index.ts new file mode 100644 index 00000000..da8847bd --- /dev/null +++ b/src/view/index.ts @@ -0,0 +1,31 @@ +import moment from 'moment' +import {library} from '@fortawesome/fontawesome-svg-core' + +import {faComment} from '@fortawesome/free-regular-svg-icons/faComment' +import {faHeart} from '@fortawesome/free-regular-svg-icons/faHeart' +import {faShareFromSquare} from '@fortawesome/free-solid-svg-icons/faShareFromSquare' +import {faRetweet} from '@fortawesome/free-solid-svg-icons/faRetweet' + +export function setup() { + moment.updateLocale('en', { + relativeTime: { + future: 'in %s', + past: '%s ago', + s: 'a few seconds', + ss: '%ds', + m: 'a minute', + mm: '%dm', + h: 'an hour', + hh: '%dh', + d: 'a day', + dd: '%dd', + w: 'a week', + ww: '%dw', + M: 'a month', + MM: '%dmo', + y: 'a year', + yy: '%dy', + }, + }) + library.add(faComment, faHeart, faRetweet, faShareFromSquare) +} diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx index 53ec44eb..affd042d 100644 --- a/src/view/screens/Home.tsx +++ b/src/view/screens/Home.tsx @@ -14,9 +14,6 @@ export function Home(/*{navigation}: RootTabsScreenProps<'Home'>*/) { return ( - - Hello, {store.me.displayName} ({store.me.name}) - diff --git a/yarn.lock b/yarn.lock index 85511390..19437d1d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1356,6 +1356,40 @@ minimatch "^3.1.2" strip-json-comments "^3.1.1" +"@fortawesome/fontawesome-common-types@6.1.1": + version "6.1.1" + resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.1.1.tgz#7dc996042d21fc1ae850e3173b5c67b0549f9105" + integrity sha512-wVn5WJPirFTnzN6tR95abCx+ocH+3IFLXAgyavnf9hUmN0CfWoDjPT/BAWsUVwSlYYVBeCLJxaqi7ZGe4uSjBA== + +"@fortawesome/fontawesome-svg-core@^6.1.1": + version "6.1.1" + resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.1.1.tgz#3424ec6182515951816be9b11665d67efdce5b5f" + integrity sha512-NCg0w2YIp81f4V6cMGD9iomfsIj7GWrqmsa0ZsPh59G7PKiGN1KymZNxmF00ssuAlo/VZmpK6xazsGOwzKYUMg== + dependencies: + "@fortawesome/fontawesome-common-types" "6.1.1" + +"@fortawesome/free-regular-svg-icons@^6.1.1": + version "6.1.1" + resolved "https://registry.yarnpkg.com/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.1.1.tgz#3f2f58262a839edf0643cbacee7a8a8230061c98" + integrity sha512-xXiW7hcpgwmWtndKPOzG+43fPH7ZjxOaoeyooptSztGmJxCAflHZxXNK0GcT0uEsR4jTGQAfGklDZE5NHoBhKg== + dependencies: + "@fortawesome/fontawesome-common-types" "6.1.1" + +"@fortawesome/free-solid-svg-icons@^6.1.1": + version "6.1.1" + resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.1.1.tgz#3369e673f8fe8be2fba30b1ec274d47490a830a6" + integrity sha512-0/5exxavOhI/D4Ovm2r3vxNojGZioPwmFrKg0ZUH69Q68uFhFPs6+dhAToh6VEQBntxPRYPuT5Cg1tpNa9JUPg== + dependencies: + "@fortawesome/fontawesome-common-types" "6.1.1" + +"@fortawesome/react-native-fontawesome@^0.3.0": + version "0.3.0" + resolved "https://registry.yarnpkg.com/@fortawesome/react-native-fontawesome/-/react-native-fontawesome-0.3.0.tgz#b59c45cdae2451d15f826f937d6e1a6e9dca0c74" + integrity sha512-wSfetdK4+b/pvPbM2v+bZ5hfNlwtk9l3QuJo59sbMrxJalfX7BuF2WsSIWMSxfWwSsbOtY4+TUs6uw/rE59NJA== + dependencies: + humps "^2.0.1" + prop-types "^15.7.2" + "@hapi/hoek@^9.0.0": version "9.3.0" resolved "https://registry.yarnpkg.com/@hapi/hoek/-/hoek-9.3.0.tgz#8368869dcb735be2e7f5cb7647de78e167a251fb" @@ -4812,6 +4846,17 @@ css-select@^4.1.3: domutils "^2.8.0" nth-check "^2.0.1" +css-select@^5.1.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/css-select/-/css-select-5.1.0.tgz#b8ebd6554c3637ccc76688804ad3f6a6fdaea8a6" + integrity sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg== + dependencies: + boolbase "^1.0.0" + css-what "^6.1.0" + domhandler "^5.0.2" + domutils "^3.0.1" + nth-check "^2.0.1" + css-tree@1.0.0-alpha.37: version "1.0.0-alpha.37" resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.0.0-alpha.37.tgz#98bebd62c4c1d9f960ec340cf9f7522e30709a22" @@ -4833,7 +4878,7 @@ css-what@^3.2.1: resolved "https://registry.yarnpkg.com/css-what/-/css-what-3.4.2.tgz#ea7026fcb01777edbde52124e21f327e7ae950e4" integrity sha512-ACUm3L0/jiZTqfzRM3Hi9Q8eZqd6IK37mMWPLz9PJxkLWllYeRf+EHUSHYEtFop2Eqytaq1FizFVh7XfBnXCDQ== -css-what@^6.0.1: +css-what@^6.0.1, css-what@^6.1.0: version "6.1.0" resolved "https://registry.yarnpkg.com/css-what/-/css-what-6.1.0.tgz#fb5effcf76f1ddea2c81bdfaa4de44e79bac70f4" integrity sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw== @@ -5229,12 +5274,21 @@ dom-serializer@^1.0.1: domhandler "^4.2.0" entities "^2.0.0" +dom-serializer@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-2.0.0.tgz#e41b802e1eedf9f6cae183ce5e622d789d7d8e53" + integrity sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg== + dependencies: + domelementtype "^2.3.0" + domhandler "^5.0.2" + entities "^4.2.0" + domelementtype@1: version "1.3.1" resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.3.1.tgz#d048c44b37b0d10a7f2a3d5fee3f4333d790481f" integrity sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w== -domelementtype@^2.0.1, domelementtype@^2.2.0: +domelementtype@^2.0.1, domelementtype@^2.2.0, domelementtype@^2.3.0: version "2.3.0" resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.3.0.tgz#5c45e8e869952626331d7aab326d01daf65d589d" integrity sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw== @@ -5253,6 +5307,13 @@ domhandler@^4.0.0, domhandler@^4.2.0, domhandler@^4.3.1: dependencies: domelementtype "^2.2.0" +domhandler@^5.0.1, domhandler@^5.0.2: + version "5.0.3" + resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-5.0.3.tgz#cc385f7f751f1d1fc650c21374804254538c7d31" + integrity sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w== + dependencies: + domelementtype "^2.3.0" + domutils@^1.7.0: version "1.7.0" resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.7.0.tgz#56ea341e834e06e6748af7a1cb25da67ea9f8c2a" @@ -5270,6 +5331,15 @@ domutils@^2.5.2, domutils@^2.8.0: domelementtype "^2.2.0" domhandler "^4.2.0" +domutils@^3.0.1: + version "3.0.1" + resolved "https://registry.yarnpkg.com/domutils/-/domutils-3.0.1.tgz#696b3875238338cb186b6c0612bd4901c89a4f1c" + integrity sha512-z08c1l761iKhDFtfXO04C7kTdPBLi41zwOZl00WS8b5eiaebNpY00HKbztwBq+e3vyqWNwWF3mP9YLUeqIrF+Q== + dependencies: + dom-serializer "^2.0.0" + domelementtype "^2.3.0" + domhandler "^5.0.1" + dot-case@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/dot-case/-/dot-case-3.0.4.tgz#9b2b670d00a431667a8a75ba29cd1b98809ce751" @@ -5429,6 +5499,11 @@ entities@^2.0.0: resolved "https://registry.yarnpkg.com/entities/-/entities-2.2.0.tgz#098dc90ebb83d8dffa089d55256b351d34c4da55" integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A== +entities@^4.2.0: + version "4.3.1" + resolved "https://registry.yarnpkg.com/entities/-/entities-4.3.1.tgz#c34062a94c865c322f9d67b4384e4169bcede6a4" + integrity sha512-o4q/dYJlmyjP2zfnaWDUC6A3BQFmVTX+tZPezK7k0GLSU9QYCauscf5Y+qcEPzKL+EixVouYDgLQK5H9GrLpkg== + envinfo@^7.7.2: version "7.8.1" resolved "https://registry.yarnpkg.com/envinfo/-/envinfo-7.8.1.tgz#06377e3e5f4d379fea7ac592d5ad8927e0c4d475" @@ -6908,6 +6983,11 @@ human-signals@^2.1.0: resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-2.1.0.tgz#dc91fcba42e4d06e4abaed33b3e7a3c02f514ea0" integrity sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw== +humps@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/humps/-/humps-2.0.1.tgz#dd02ea6081bd0568dc5d073184463957ba9ef9aa" + integrity sha512-E0eIbrFWUhwfXJmsbdjRQFQPrl5pTEoKlz163j1mTqqUnU9PgR4AgB8AIITzuB3vLBdxZXyZ9TDIrwB2OASz4g== + hyphenate-style-name@^1.0.2, hyphenate-style-name@^1.0.4: version "1.0.4" resolved "https://registry.yarnpkg.com/hyphenate-style-name/-/hyphenate-style-name-1.0.4.tgz#691879af8e220aea5750e8827db4ef62a54e361d" @@ -10831,7 +10911,7 @@ prompts@^2.0.1, prompts@^2.4.0, prompts@^2.4.2: kleur "^3.0.3" sisteransi "^1.0.5" -prop-types@*, prop-types@^15.6.0, prop-types@^15.8.1: +prop-types@*, prop-types@^15.6.0, prop-types@^15.7.2, prop-types@^15.8.1: version "15.8.1" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5" integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg== @@ -11062,6 +11142,14 @@ react-native-screens@^3.13.1: react-freeze "^1.0.0" warn-once "^0.1.0" +react-native-svg@^12.4.0: + version "12.4.0" + resolved "https://registry.yarnpkg.com/react-native-svg/-/react-native-svg-12.4.0.tgz#934a89d3da7936aa76361b748e4ba58a1bcb9bf5" + integrity sha512-m2Hn5FMC7wF/BSwxrbZFVElOMAJZXLJl2bBMDXvs/fFy2v4oLBfcw8MwaBTlaIyk0p24WRC9lWv51kSA/Plj5w== + dependencies: + css-select "^5.1.0" + css-tree "^1.1.3" + react-native-url-polyfill@^1.3.0: version "1.3.0" resolved "https://registry.yarnpkg.com/react-native-url-polyfill/-/react-native-url-polyfill-1.3.0.tgz#c1763de0f2a8c22cc3e959b654c8790622b6ef6a"