diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md index 6c970cbfc..ab1ea5b1d 100644 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -11,7 +11,7 @@ This pull request is categorized as a: - [ ] Code refactor - [ ] Configuration change - [ ] Locales update -- [ ] Quality assurance +- [ ] Quality assurance - [ ] Other ## Checklist diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml index 30bee9903..d6a5422e5 100644 --- a/.github/workflows/lint.yml +++ b/.github/workflows/lint.yml @@ -14,6 +14,6 @@ jobs: - name: Use Node.js uses: actions/setup-node@v3 with: - node-version: '16.x' + node-version: '18.x' - run: yarn install --frozen-lockfile - run: yarn run lint diff --git a/.github/workflows/prettier.yml b/.github/workflows/prettier.yml index 721300083..974f60e2c 100644 --- a/.github/workflows/prettier.yml +++ b/.github/workflows/prettier.yml @@ -14,6 +14,6 @@ jobs: - name: Use Node.js uses: actions/setup-node@v3 with: - node-version: '16.x' + node-version: '18.x' - run: yarn install --frozen-lockfile - run: yarn run prettier diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index 1ceda1791..8f8400de8 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -14,6 +14,6 @@ jobs: - name: Use Node.js uses: actions/setup-node@v3 with: - node-version: '16.x' + node-version: '18.x' - run: yarn install --frozen-lockfile - run: yarn run test diff --git a/README.md b/README.md index 259a5c592..6e04693e7 100644 --- a/README.md +++ b/README.md @@ -108,6 +108,9 @@ ZEUS is proud to be integrated on the following platforms: **Don't trust, verify** the code with your own two eyes. Then when ready proceed to the steps below based on your platform. +### Prerequisites +1. Node.js (minimum version: 18.17) + ### Android 1. install and setup react-native and its related dependencies under **"Building Projects with Native Code"** on [react-native's Getting Started page](https://reactnative.dev/docs/environment-setup) diff --git a/check-styles.test.ts b/check-styles.test.ts new file mode 100644 index 000000000..0620d99d4 --- /dev/null +++ b/check-styles.test.ts @@ -0,0 +1,38 @@ +import * as fs from 'fs'; +import * as path from 'path'; + +describe('static style sheets', () => { + it('must not contain themeColor() calls', () => { + const dirs = fs + .readdirSync('.', { withFileTypes: true }) + .filter((e) => e.isDirectory() && e.name !== 'node_modules') + .map((e) => e.name); + dirs.push('.'); + const tsxFiles = dirs.flatMap((dir) => + fs + .readdirSync(dir, { recursive: dir !== '.' }) + .filter( + (file) => + typeof file === 'string' && + !file.startsWith('node_modules/') && + file.toLowerCase().endsWith('.tsx') + ) + .map((file) => path.join(dir, file as string)) + ); + const regExp = new RegExp( + /\n[^\s][^\n]+StyleSheet\.create\(\{.*themeColor\(/, + 's' + ); + const invalidFiles = tsxFiles.filter((file) => + fs.readFileSync(file).toString('utf8').match(regExp) + ); + + if (invalidFiles.length > 0) { + throw new Error( + 'The following files contain static StyleSheets with themeColor() calls. ' + + 'This is not allowed because the color then will not be updated when theme is changed.\n' + + invalidFiles.join('\n') + ); + } + }); +}); diff --git a/components/CollapsedQR.tsx b/components/CollapsedQR.tsx index 394e2532f..67903511a 100644 --- a/components/CollapsedQR.tsx +++ b/components/CollapsedQR.tsx @@ -41,12 +41,17 @@ function ValueText({ value, truncateLongValue }: ValueTextProps) { } highlight={false} > - + {value} ) : ( - {value} + + {value} + ); } @@ -259,7 +264,6 @@ const styles = StyleSheet.create({ value: { marginBottom: 15, paddingLeft: 20, - color: themeColor('secondaryText'), fontFamily: 'PPNeueMontreal-Book' }, qrPadding: { diff --git a/package.json b/package.json index fc1100ee7..c7f700bdc 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,8 @@ ], "transformIgnorePatterns": [ "node_modules/(?!(react-native|@react-native|react-native-blob-util|react-native-randombytes)/)" - ] + ], + "testPathIgnorePatterns": ["check-styles.test.ts"] }, "scripts": { "start": "react-native start", @@ -18,7 +19,7 @@ "postinstall": "rn-nodeify --install --hack & npx jetify & yarn run patch & react-native setup-ios-permissions & yarn run fetch-libraries & pod-install", "test": "jest", "tsc": "tsc", - "lint": "eslint --ext .js,.ts,.tsx \"*.@(js|ts|tsx)\" .", + "lint": "eslint --ext .js,.ts,.tsx \"*.@(js|ts|tsx)\" . && yarn run test check-styles.test.ts --testPathIgnorePatterns=", "prettier": "prettier --check \"**/*.ts*\"", "prettier-write": "prettier --check --write \"**/*.ts*\"", "patch": "git apply patches/react-native-camera-kit.patch && git apply patches/rnqli-build.gradle.patch", diff --git a/views/Channels/Channel.tsx b/views/Channels/Channel.tsx index b9b5258d2..8b83ad97c 100644 --- a/views/Channels/Channel.tsx +++ b/views/Channels/Channel.tsx @@ -261,7 +261,9 @@ export default class ChannelView extends React.Component< localBalance={lurkerMode ? 50 : localBalance} remoteBalance={lurkerMode ? 50 : remoteBalance} /> - + {pendingOpen ? localeString('views.Channel.pendingOpen') : pendingClose || closing @@ -568,7 +570,12 @@ export default class ChannelView extends React.Component< {(BackendUtils.isLNDBased() || !implementation) && ( <> - + {localeString( 'views.Channel.closingRate' )} @@ -610,11 +617,6 @@ export default class ChannelView extends React.Component< const styles = StyleSheet.create({ text: { - color: themeColor('text'), - fontFamily: 'PPNeueMontreal-Book' - }, - secondaryText: { - color: themeColor('secondaryText'), fontFamily: 'PPNeueMontreal-Book' }, content: { @@ -626,7 +628,6 @@ const styles = StyleSheet.create({ }, status: { fontFamily: 'PPNeueMontreal-Book', - color: themeColor('text'), alignSelf: 'center', marginBottom: 10 }, @@ -639,22 +640,8 @@ const styles = StyleSheet.create({ paddingBottom: 30, textAlign: 'center' }, - balance: { - fontSize: 15, - fontWeight: 'bold' - }, button: { paddingTop: 15, paddingBottom: 15 - }, - editFeeBox: { - paddingTop: 10, - paddingBottom: 10, - paddingLeft: 15, - marginTop: 15, - flexDirection: 'row', - borderRadius: 4, - borderColor: themeColor('secondaryText'), - borderWidth: 3 } }); diff --git a/views/ContactDetails.tsx b/views/ContactDetails.tsx index 4695674f9..7383d3b6d 100644 --- a/views/ContactDetails.tsx +++ b/views/ContactDetails.tsx @@ -281,9 +281,12 @@ export default class ContactDetails extends React.Component< > {address.length > 23 ? `${address.substring( @@ -326,9 +329,12 @@ export default class ContactDetails extends React.Component< > {address.length > 23 ? `${address.substring( @@ -372,9 +378,12 @@ export default class ContactDetails extends React.Component< > {address.length > 23 ? `${address.substring( @@ -413,9 +422,12 @@ export default class ContactDetails extends React.Component< > {value.length > 15 ? `${value.substring( @@ -454,9 +466,12 @@ export default class ContactDetails extends React.Component< {value.length > 15 ? `${value.substring( @@ -498,7 +513,6 @@ const styles = StyleSheet.create({ contactFields: { fontSize: 24, marginBottom: 4, - marginLeft: 4, - color: themeColor('chain') + marginLeft: 4 } }); diff --git a/views/EditFee.tsx b/views/EditFee.tsx index fdaebb424..9c52bc2e8 100644 --- a/views/EditFee.tsx +++ b/views/EditFee.tsx @@ -299,7 +299,14 @@ export default class EditFee extends React.Component< {!displayOnly && ( <> - + {localeString( 'views.EditFee.custom' )} @@ -403,12 +410,6 @@ const styles = StyleSheet.create({ feeText: { fontSize: 18 }, - custom: { - color: themeColor('text'), - fontSize: 18, - top: 48, - left: 15 - }, confirmButton: { marginTop: 20, width: 350 diff --git a/views/LnurlPay/Success.tsx b/views/LnurlPay/Success.tsx index a1b136c9f..464f72242 100644 --- a/views/LnurlPay/Success.tsx +++ b/views/LnurlPay/Success.tsx @@ -119,14 +119,27 @@ export default class LnurlPaySuccess extends React.Component {body} {servicedBy} ) : ( - + {body} {servicedBy} @@ -138,8 +151,6 @@ const styles = StyleSheet.create({ container: { borderWidth: 1, borderRadius: 5, - borderColor: themeColor('text'), - backgroundColor: themeColor('secondary'), gap: 5 } }); diff --git a/views/Routing/RoutingHeader.tsx b/views/Routing/RoutingHeader.tsx index 520944954..3ffb1e6db 100644 --- a/views/Routing/RoutingHeader.tsx +++ b/views/Routing/RoutingHeader.tsx @@ -66,8 +66,7 @@ export function RoutingHeader(props) { : 120, padding: 16, borderBottomLeftRadius: 40, - borderBottomRightRadius: 20, - color: themeColor('text') + borderBottomRightRadius: 20 } }); diff --git a/views/Settings/AddContact.tsx b/views/Settings/AddContact.tsx index 23ad8e589..9c346a3a8 100644 --- a/views/Settings/AddContact.tsx +++ b/views/Settings/AddContact.tsx @@ -461,7 +461,10 @@ export default class AddContact extends React.Component< placeholderTextColor={themeColor( 'secondaryText' )} - style={styles.textInput} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -488,7 +491,10 @@ export default class AddContact extends React.Component< placeholderTextColor={themeColor( 'secondaryText' )} - style={styles.textInput} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -516,7 +522,14 @@ export default class AddContact extends React.Component< ); }} > - + {value.key} @@ -561,7 +574,10 @@ export default class AddContact extends React.Component< placeholderTextColor={themeColor( 'secondaryText' )} - style={[styles.textInput]} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -608,7 +624,10 @@ export default class AddContact extends React.Component< placeholderTextColor={themeColor( 'secondaryText' )} - style={styles.textInput} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -664,7 +683,10 @@ export default class AddContact extends React.Component< 'secondaryText' )} numberOfLines={1} - style={styles.textInput} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -710,7 +732,10 @@ export default class AddContact extends React.Component< placeholderTextColor={themeColor( 'secondaryText' )} - style={styles.textInput} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -769,7 +794,10 @@ export default class AddContact extends React.Component< placeholderTextColor={themeColor( 'secondaryText' )} - style={[styles.textInput]} + style={{ + ...styles.textInput, + color: themeColor('text') + }} numberOfLines={1} autoCapitalize="none" /> @@ -819,7 +847,10 @@ export default class AddContact extends React.Component< placeholderTextColor={themeColor( 'secondaryText' )} - style={styles.textInput} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -875,7 +906,10 @@ export default class AddContact extends React.Component< 'secondaryText' )} numberOfLines={1} - style={styles.textInput} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -920,7 +954,10 @@ export default class AddContact extends React.Component< placeholderTextColor={themeColor( 'secondaryText' )} - style={styles.textInput} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -976,7 +1013,10 @@ export default class AddContact extends React.Component< 'secondaryText' )} numberOfLines={1} - style={styles.textInput} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -1020,7 +1060,10 @@ export default class AddContact extends React.Component< placeholderTextColor={themeColor( 'secondaryText' )} - style={styles.textInput} + style={{ + ...styles.textInput, + color: themeColor('text') + }} autoCapitalize="none" /> @@ -1062,7 +1105,12 @@ export default class AddContact extends React.Component< marginTop: 10 }} > - + {localeString( 'views.Settings.AddContact.addExtraField' )} @@ -1164,13 +1212,11 @@ const styles = StyleSheet.create({ }, modalItem: { paddingVertical: 10, - fontSize: 16, - color: themeColor('secondary') + fontSize: 16 }, addExtraFieldText: { fontSize: 18, - fontWeight: 'bold', - color: themeColor('text') + fontWeight: 'bold' }, inputContainer: { paddingTop: Platform.OS === 'ios' ? 9 : 0, @@ -1200,8 +1246,7 @@ const styles = StyleSheet.create({ fontSize: 20, width: '100%', fontFamily: 'PPNeueMontreal-Book', - top: 5, - color: themeColor('text') + top: 5 }, photo: { alignSelf: 'center', diff --git a/views/Settings/LightningAddress/ChangeAddress.tsx b/views/Settings/LightningAddress/ChangeAddress.tsx index 029ee5f70..114fb5879 100644 --- a/views/Settings/LightningAddress/ChangeAddress.tsx +++ b/views/Settings/LightningAddress/ChangeAddress.tsx @@ -76,7 +76,12 @@ export default class ChangeAddress extends React.Component< <> - + {localeString( 'views.Settings.LightningAddress.chooseHandle' )} @@ -107,6 +112,7 @@ export default class ChangeAddress extends React.Component< - + {`${localeString( 'nostr.privkey' )} ${localeString( @@ -382,8 +387,7 @@ export default class NostrKey extends React.Component< const styles = StyleSheet.create({ text: { - fontFamily: 'PPNeueMontreal-Book', - color: themeColor('text') + fontFamily: 'PPNeueMontreal-Book' }, wrapper: { flex: 1, diff --git a/views/Settings/LightningAddress/index.tsx b/views/Settings/LightningAddress/index.tsx index d0b2a73d0..ae15800e7 100644 --- a/views/Settings/LightningAddress/index.tsx +++ b/views/Settings/LightningAddress/index.tsx @@ -384,7 +384,12 @@ export default class LightningAddress extends React.Component< <> - + {localeString( 'views.Settings.LightningAddress.chooseHandle' )} @@ -415,6 +420,7 @@ export default class LightningAddress extends React.Component<