67 changed files with 975 additions and 244 deletions
|
Before Width: | Height: | Size: 893 B |
|
Before Width: | Height: | Size: 691 B |
|
Before Width: | Height: | Size: 511 B |
@ -0,0 +1,8 @@
@@ -0,0 +1,8 @@
|
||||
interface Validation { |
||||
isRequire: string |
||||
} |
||||
|
||||
export interface Common { |
||||
validate: Validation |
||||
shareMessage: string |
||||
} |
||||
@ -0,0 +1,15 @@
@@ -0,0 +1,15 @@
|
||||
import { Buttons } from './buttons.interface' |
||||
import { Common } from './common.interface' |
||||
import { CustomPack } from './custom-pack.interface' |
||||
import { OnBoardingLocale } from './on-boarding.types.interface' |
||||
import { PageTitles } from './page-titles.interface' |
||||
import { SettingLocale } from './settings.types.interface' |
||||
|
||||
export interface MainLocaleModule { |
||||
stepTranslation: OnBoardingLocale.OnboardingSteps |
||||
settingTranslation: SettingLocale.Core |
||||
buttonsTranslation: Buttons |
||||
customPack: CustomPack |
||||
pageTitles: PageTitles |
||||
common: Common |
||||
} |
||||
@ -0,0 +1,12 @@
@@ -0,0 +1,12 @@
|
||||
export namespace SettingLocale { |
||||
export interface Core { |
||||
purchases: string |
||||
language: string |
||||
notifications: string |
||||
write: string |
||||
rate: string |
||||
share: string |
||||
policy: string |
||||
label: string |
||||
} |
||||
} |
||||
@ -0,0 +1,11 @@
@@ -0,0 +1,11 @@
|
||||
import { Common } from '../../interfaces/common.interface' |
||||
|
||||
const Validation = { |
||||
isRequire: 'Field is require', |
||||
length: 'At least 5 characters', |
||||
} |
||||
|
||||
export const common: Common = { |
||||
validate: Validation, |
||||
shareMessage: 'Share this app with your friends', |
||||
} |
||||
@ -1,4 +1,5 @@
@@ -1,4 +1,5 @@
|
||||
export const customPack = { |
||||
title: 'Create custom pack', |
||||
description: 'Create your own custom pack with questions and task. It all depends on your imagination!', |
||||
} |
||||
title: 'Create custom pack', |
||||
description: |
||||
'Create your own custom pack with questions and task. It all depends on your imagination!', |
||||
} |
||||
|
||||
@ -1,13 +1,16 @@
@@ -1,13 +1,16 @@
|
||||
import {MainLocaleModule} from '../../types'; |
||||
import {settingTranslation} from './settings.translation'; |
||||
import {onBoardingTranslation} from './steps.translation'; |
||||
import {buttonsTranslation} from './onBoardingButton.translation'; |
||||
import {customPack} from './custom-pack.translation'; |
||||
import {pageTitles} from './page-title.translation'; |
||||
import { MainLocaleModule } from '../../interfaces' |
||||
import { settingTranslation } from './settings.translation' |
||||
import { onBoardingTranslation } from './steps.translation' |
||||
import { buttonsTranslation } from './onBoardingButton.translation' |
||||
import { customPack } from './custom-pack.translation' |
||||
import { pageTitles } from './page-title.translation' |
||||
import { common } from './common.translation' |
||||
|
||||
export const en: MainLocaleModule = { |
||||
settingTranslation, |
||||
stepTranslation: onBoardingTranslation, |
||||
buttonsTranslation, |
||||
customPack, |
||||
pageTitles, |
||||
}; |
||||
settingTranslation, |
||||
stepTranslation: onBoardingTranslation, |
||||
buttonsTranslation, |
||||
customPack, |
||||
pageTitles, |
||||
common, |
||||
} |
||||
|
||||
@ -1,5 +1,7 @@
@@ -1,5 +1,7 @@
|
||||
export const pageTitles = { |
||||
setting: 'Setting', |
||||
privacy: 'Privacy Policy', |
||||
terms: 'Terms and conditions', |
||||
} |
||||
setting: 'Setting', |
||||
purchases: 'Purchases', |
||||
privacy: 'Privacy Policy', |
||||
terms: 'Terms and conditions', |
||||
writeToUs: 'Write to us', |
||||
} |
||||
|
||||
@ -1,11 +1,12 @@
@@ -1,11 +1,12 @@
|
||||
import {SettingLocale} from '../../types/settings.types'; |
||||
import { SettingLocale } from '../../interfaces/settings.types.interface' |
||||
|
||||
export const settingTranslation: SettingLocale.Core = { |
||||
purchases: 'Purchases!', |
||||
language: 'Language', |
||||
write: 'Write to us', |
||||
rate: 'Rate us', |
||||
share: 'Share app', |
||||
policy: 'Privacy policy', |
||||
term: 'Terms and conditions', |
||||
information: 'Information', |
||||
}; |
||||
purchases: 'Purchases!', |
||||
language: 'Language', |
||||
notifications: 'Notifications', |
||||
write: 'Write to us', |
||||
rate: 'Rate us', |
||||
share: 'Share app', |
||||
policy: 'Privacy policy', |
||||
label: 'What can we do to help?', |
||||
} |
||||
|
||||
@ -1,19 +1,18 @@
@@ -1,19 +1,18 @@
|
||||
import {OnBoardingLocale} from '../../types/on-boarding.types'; |
||||
import { OnBoardingLocale } from '../../interfaces/on-boarding.types.interface' |
||||
export const onBoardingTranslation: OnBoardingLocale.OnboardingSteps = { |
||||
step1: { |
||||
title: 'Welcome!', |
||||
description: |
||||
'Thank you for downloading. Now you are \n in the best game for the company \n or to play with your loved one', |
||||
}, |
||||
step2: { |
||||
title: 'Relax and enjoy \n the game!', |
||||
description: |
||||
'This game features 5 levels of "spiciness",\n some of which are divided into games for a \n couple or a company. All you have to do is \n add players and you can start playing.\n P.S. You can always create your own \n questions and tasks.', |
||||
}, |
||||
step3: { |
||||
title: 'Premium version!', |
||||
description: |
||||
'Provides unlimited access to Hard and \n Extreme packages. Enjoy intriguing questions \n and exciting action.', |
||||
}, |
||||
}; |
||||
|
||||
step1: { |
||||
title: 'Welcome!', |
||||
description: |
||||
'Thank you for downloading. Now you are \n in the best game for the company \n or to play with your loved one', |
||||
}, |
||||
step2: { |
||||
title: 'Relax and enjoy \n the game!', |
||||
description: |
||||
'This game features 5 levels of "spiciness",\n some of which are divided into games for a \n couple or a company. All you have to do is \n add players and you can start playing.\n P.S. You can always create your own \n questions and tasks.', |
||||
}, |
||||
step3: { |
||||
title: 'Premium version!', |
||||
description: |
||||
'Provides unlimited access to Hard and \n Extreme packages. Enjoy intriguing questions \n and exciting action.', |
||||
}, |
||||
} |
||||
|
||||
@ -1,14 +1,14 @@
@@ -1,14 +1,14 @@
|
||||
import {MainLocaleModule} from '../../types'; |
||||
import {settingTranslation} from './settings.translation'; |
||||
import {onBoardingTranslation} from './steps.translation'; |
||||
import { buttonsTranslation } from './onBoardingButton.translation'; |
||||
import {customPack} from './custom-pack.translation'; |
||||
import {pageTitles} from './page-title.translation'; |
||||
import { MainLocaleModule } from '../../interfaces' |
||||
import { settingTranslation } from './settings.translation' |
||||
import { onBoardingTranslation } from './steps.translation' |
||||
import { buttonsTranslation } from './onBoardingButton.translation' |
||||
import { customPack } from './custom-pack.translation' |
||||
import { pageTitles } from './page-title.translation' |
||||
|
||||
export const hi: MainLocaleModule = { |
||||
settingTranslation, |
||||
stepTranslation: onBoardingTranslation, |
||||
buttonsTranslation, |
||||
customPack, |
||||
pageTitles, |
||||
}; |
||||
settingTranslation, |
||||
stepTranslation: onBoardingTranslation, |
||||
buttonsTranslation, |
||||
customPack, |
||||
pageTitles, |
||||
} |
||||
|
||||
@ -0,0 +1,11 @@
@@ -0,0 +1,11 @@
|
||||
import { Common } from '../../interfaces/common.interface' |
||||
|
||||
const Validation = { |
||||
isRequire: 'Це поле обовʼязкове', |
||||
length: 'Має бути мінімум 5 символів', |
||||
} |
||||
|
||||
export const common: Common = { |
||||
validate: Validation, |
||||
shareMessage: 'Поділіться цим додатком зі своїми друзями', |
||||
} |
||||
@ -1,15 +1,16 @@
@@ -1,15 +1,16 @@
|
||||
import {MainLocaleModule} from '../../types'; |
||||
import {settingTranslation} from './settings.translation'; |
||||
import {onBoardingTranslationUa} from './step.translation'; |
||||
import { buttonsTranslation } from './onBoardingButton.translation'; |
||||
import {customPack} from './custom-pack.translation'; |
||||
import {pageTitles} from './page-title.translation'; |
||||
|
||||
import { MainLocaleModule } from '../../interfaces' |
||||
import { settingTranslation } from './settings.translation' |
||||
import { onBoardingTranslationUa } from './step.translation' |
||||
import { buttonsTranslation } from './onBoardingButton.translation' |
||||
import { customPack } from './custom-pack.translation' |
||||
import { pageTitles } from './page-title.translation' |
||||
import { common } from './common.translation' |
||||
|
||||
export const ua: MainLocaleModule = { |
||||
stepTranslation: onBoardingTranslationUa, |
||||
settingTranslation: settingTranslation, |
||||
buttonsTranslation, |
||||
customPack, |
||||
pageTitles |
||||
}; |
||||
stepTranslation: onBoardingTranslationUa, |
||||
settingTranslation, |
||||
buttonsTranslation, |
||||
customPack, |
||||
pageTitles, |
||||
common, |
||||
} |
||||
|
||||
@ -1,5 +1,7 @@
@@ -1,5 +1,7 @@
|
||||
export const pageTitles = { |
||||
setting: 'Налаштування', |
||||
privacy: 'Політика \n конфіденційності', |
||||
terms: 'Правила та умови', |
||||
} |
||||
purchases: 'Покупки', |
||||
setting: 'Налаштування', |
||||
privacy: 'Політика \n конфіденційності', |
||||
terms: 'Правила та умови', |
||||
writeToUs: 'Напишіть нам', |
||||
} |
||||
|
||||
@ -1,11 +1,14 @@
@@ -1,11 +1,14 @@
|
||||
import {SettingLocale} from '../../types/settings.types'; |
||||
import { SettingLocale } from '../../interfaces/settings.types.interface' |
||||
|
||||
export const settingTranslation: SettingLocale.Core = { |
||||
purchases: 'Магазин!', |
||||
language: 'Мова', |
||||
write: 'Напишіть нам', |
||||
rate: 'Оцініть нас', |
||||
share: 'Поділитися програмою', |
||||
policy: 'Політика конфіденційності', |
||||
term: 'Правила та умови', |
||||
information: 'Інформація', |
||||
}; |
||||
purchases: 'Магазин', |
||||
language: 'Мова', |
||||
notifications: 'Сповіщення', |
||||
write: 'Напишіть нам', |
||||
rate: 'Оцініть нас', |
||||
share: 'Поділитися програмою', |
||||
policy: 'Політика конфіденційності', |
||||
term: 'Правила та умови', |
||||
information: 'Інформація', |
||||
label: 'Чим ми можемо допомогти', |
||||
} |
||||
|
||||
@ -1,12 +0,0 @@
@@ -1,12 +0,0 @@
|
||||
import { CustomPack, PageTitles } from '../../module/common' |
||||
import { Buttons } from './buttons.types' |
||||
import { OnBoardingLocale } from './on-boarding.types' |
||||
import { SettingLocale } from './settings.types' |
||||
|
||||
export interface MainLocaleModule { |
||||
stepTranslation: OnBoardingLocale.OnboardingSteps |
||||
settingTranslation: SettingLocale.Core |
||||
buttonsTranslation: Buttons |
||||
customPack: CustomPack |
||||
pageTitles: PageTitles |
||||
} |
||||
@ -1,12 +0,0 @@
@@ -1,12 +0,0 @@
|
||||
export namespace SettingLocale { |
||||
export interface Core { |
||||
purchases: string; |
||||
language: string; |
||||
write: string; |
||||
rate: string; |
||||
share: string; |
||||
policy: string; |
||||
term: string; |
||||
information: string; |
||||
} |
||||
} |
||||
@ -0,0 +1,60 @@
@@ -0,0 +1,60 @@
|
||||
import React, { FC, PropsWithChildren } from 'react' |
||||
import { StyleSheet, View, ViewStyle } from 'react-native' |
||||
import { Txt } from '../txt' |
||||
import { $size } from '../../helpers' |
||||
import { colors } from '../../colors' |
||||
|
||||
interface FormControllWrapProps { |
||||
label?: string |
||||
error?: string |
||||
style?: ViewStyle |
||||
rightLabel?: string |
||||
} |
||||
|
||||
export const FormControllWrap: FC<PropsWithChildren<FormControllWrapProps>> = ({ |
||||
label, |
||||
error, |
||||
children, |
||||
style, |
||||
rightLabel, |
||||
}) => { |
||||
return ( |
||||
<View style={[styles.container, style]}> |
||||
<View style={styles.labelWrap}> |
||||
{label ? ( |
||||
<Txt mod="lg" style={styles.label}> |
||||
{label} |
||||
</Txt> |
||||
) : null} |
||||
{rightLabel ? ( |
||||
<Txt style={styles.label}>{rightLabel}</Txt> |
||||
) : null} |
||||
</View> |
||||
|
||||
{children} |
||||
|
||||
{error ? <Txt style={styles.error}>{error}</Txt> : null} |
||||
</View> |
||||
) |
||||
} |
||||
|
||||
const styles = StyleSheet.create({ |
||||
container: { |
||||
marginBottom: $size(12), |
||||
width: '100%', |
||||
}, |
||||
labelWrap: { |
||||
flexDirection: 'row', |
||||
justifyContent: 'space-between', |
||||
marginBottom: $size(5), |
||||
}, |
||||
label: { |
||||
color: colors.secondaryText, |
||||
marginBottom: $size(8), |
||||
}, |
||||
error: { |
||||
color: colors.red, |
||||
fontSize: $size(13), |
||||
marginTop: $size(5), |
||||
}, |
||||
}) |
||||
@ -0,0 +1,117 @@
@@ -0,0 +1,117 @@
|
||||
import React, { FC } from 'react' |
||||
import { |
||||
StyleSheet, |
||||
TextInput, |
||||
TextInputProps, |
||||
View, |
||||
ViewStyle, |
||||
} from 'react-native' |
||||
import { Txt } from '../txt' |
||||
import { FormControllWrap } from './form-controll-wrap.component' |
||||
import { Font } from '../../typing' |
||||
import { $size } from '../../helpers' |
||||
import { colors } from '../../colors' |
||||
|
||||
interface FormTextControllProps { |
||||
value: string |
||||
onChange: (value: string) => void |
||||
|
||||
inputProps?: Omit<TextInputProps, 'value' | 'onChange'> |
||||
|
||||
label?: string |
||||
error?: string |
||||
|
||||
postfix?: string |
||||
subtext?: string |
||||
|
||||
inputStyle?: ViewStyle |
||||
style?: ViewStyle |
||||
} |
||||
|
||||
export const FormTextControll: FC<FormTextControllProps> = ({ |
||||
value, |
||||
onChange, |
||||
|
||||
inputProps = {}, |
||||
|
||||
label, |
||||
error, |
||||
|
||||
postfix, |
||||
subtext, |
||||
|
||||
inputStyle, |
||||
style, |
||||
}) => { |
||||
const renderPostfix = () => { |
||||
if (postfix) |
||||
return ( |
||||
<View style={styles.rightComponent}> |
||||
<Txt style={styles.postfix}>{postfix}</Txt> |
||||
</View> |
||||
) |
||||
} |
||||
|
||||
return ( |
||||
<FormControllWrap label={label} error={error} style={style}> |
||||
<View style={styles.inputContainer}> |
||||
<TextInput |
||||
style={[ |
||||
styles.input, |
||||
error ? styles.inputActive : null, |
||||
inputStyle, |
||||
]} |
||||
value={value} |
||||
onChangeText={onChange} |
||||
placeholderTextColor="#A0A3BD" |
||||
{...inputProps} |
||||
/> |
||||
{renderPostfix()} |
||||
</View> |
||||
{subtext ? <Txt style={styles.subtext}>{subtext}</Txt> : null} |
||||
</FormControllWrap> |
||||
) |
||||
} |
||||
|
||||
const styles = StyleSheet.create({ |
||||
containerActive: { |
||||
borderColor: '#FB5450', |
||||
}, |
||||
inputContainer: { |
||||
position: 'relative', |
||||
paddingRight: 1, |
||||
}, |
||||
input: { |
||||
borderColor: colors.secondaryText, |
||||
borderWidth: 1, |
||||
height: $size(50), |
||||
paddingHorizontal: $size(18), |
||||
borderRadius: 16, |
||||
color: colors.textPrimary, |
||||
fontFamily: Font.Roboto400, |
||||
fontSize: $size(15), |
||||
lineHeight: $size(20), |
||||
}, |
||||
inputActive: { |
||||
borderColor: '#FB5450', |
||||
}, |
||||
rightComponent: { |
||||
position: 'absolute', |
||||
right: 0, |
||||
top: 0, |
||||
height: 56, |
||||
justifyContent: 'center', |
||||
alignItems: 'center', |
||||
paddingRight: 20, |
||||
// width: 100,
|
||||
}, |
||||
postfix: { |
||||
color: '#9693AC', |
||||
fontSize: $size(15), |
||||
}, |
||||
subtext: { |
||||
color: '#808080', |
||||
fontSize: $size(12), |
||||
marginBottom: 4, |
||||
}, |
||||
}) |
||||
@ -0,0 +1,3 @@
@@ -0,0 +1,3 @@
|
||||
export * from './form-controll-wrap.component'; |
||||
export * from './form-text-controll.component'; |
||||
|
||||
@ -1,7 +1,7 @@
@@ -1,7 +1,7 @@
|
||||
export * from './icon'; |
||||
export * from './buttons'; |
||||
export * from './header'; |
||||
export * from './layout'; |
||||
export * from './modal'; |
||||
export * from './txt'; |
||||
|
||||
export * from './icon' |
||||
export * from './buttons' |
||||
export * from './header' |
||||
export * from './layout' |
||||
export * from './modal' |
||||
export * from './txt' |
||||
export * from './form' |
||||
|
||||
@ -0,0 +1,67 @@
@@ -0,0 +1,67 @@
|
||||
import _ from 'lodash' |
||||
import React, { useState } from 'react' |
||||
|
||||
export interface IUseFormState { |
||||
[key: string]: string | number | boolean | any |
||||
} |
||||
type IValidateMethod<T> = (data: T) => FormErrors<T> | null |
||||
|
||||
export type FormErrors<T> = Partial<Record<keyof T, string>> |
||||
|
||||
export interface IForm<T> { |
||||
values: T |
||||
setForm: (form: T) => void |
||||
errors: FormErrors<T> |
||||
setFormField: (key: keyof T, value: any) => any |
||||
setFormError: (key: keyof T, error: string) => void |
||||
setFormErrors: (errors: Record<keyof T, string>) => void |
||||
onSubmit: (callback: Function) => Function |
||||
hasErrors: Boolean |
||||
} |
||||
|
||||
export const useForm = <T extends IUseFormState>( |
||||
initValue: Partial<T>, |
||||
validateMethod: IValidateMethod<T>, |
||||
): IForm<T> => { |
||||
const [values, setForm] = useState(initValue as T) |
||||
const [errors, setErrors] = useState<FormErrors<T>>({}) |
||||
|
||||
const setFormError = (f: keyof T, e: any) => { |
||||
setErrors(oldErrors => { |
||||
return { ...oldErrors, [f]: e } |
||||
}) |
||||
} |
||||
const setFormField = (f: keyof T, v: any) => { |
||||
setForm(oldForm => { |
||||
return { ...oldForm, [f]: v } |
||||
}) |
||||
setFormError(f, null) |
||||
} |
||||
|
||||
const validate = () => { |
||||
const _errors = validateMethod(values) |
||||
if (_errors) { |
||||
setErrors(_errors) |
||||
return true |
||||
} |
||||
} |
||||
|
||||
const onSubmit = (callback: Function): any => { |
||||
if (validate && validate()) { |
||||
return |
||||
} |
||||
|
||||
callback() |
||||
} |
||||
|
||||
return { |
||||
values, |
||||
setForm, |
||||
errors, |
||||
setFormField, |
||||
setFormError, |
||||
setFormErrors: setErrors, |
||||
onSubmit, |
||||
hasErrors: !_.isEmpty(_.omitBy(errors, _.isNil)), |
||||
} |
||||
} |
||||
@ -1 +1,2 @@
@@ -1 +1,2 @@
|
||||
export * from './global-container.tool' |
||||
export * from './validate.tool' |
||||
|
||||
@ -0,0 +1,67 @@
@@ -0,0 +1,67 @@
|
||||
import _ from 'lodash' |
||||
import _validate from 'validate.js' |
||||
|
||||
export const prepareValidatorResult = <T extends Record<string, any>>( |
||||
result: T, |
||||
): Record<keyof T, string> | null => { |
||||
if (_.isEmpty(result)) { |
||||
return null |
||||
} |
||||
|
||||
_.each(result, (it, key, arr: any) => { |
||||
arr[key] = it[0] |
||||
}) |
||||
|
||||
return result |
||||
} |
||||
|
||||
const presenceCost = { |
||||
allowEmpty: false, |
||||
message: '^Field is required', |
||||
messageStatic: '^Field is required', |
||||
} |
||||
|
||||
const validate = <T extends Record<string, any>>( |
||||
values: T, |
||||
constraints: any, |
||||
) => { |
||||
const result = _validate(values, constraints) |
||||
return prepareValidatorResult<T>(result) |
||||
} |
||||
|
||||
_validate.validators.array = ( |
||||
arrayItems: any[], |
||||
options: { length: number; message: string; key?: string }, |
||||
) => { |
||||
if (_.isEmpty(arrayItems)) { |
||||
return presenceCost.message |
||||
} |
||||
if (arrayItems.length < options.length) { |
||||
return options.message |
||||
} |
||||
|
||||
if (options.key) { |
||||
if (!arrayItems[0][options.key]) { |
||||
return options.message |
||||
} |
||||
} |
||||
|
||||
return null |
||||
} |
||||
|
||||
_validate.validators.characters = ( |
||||
value: string, |
||||
options: { |
||||
message: string |
||||
}, |
||||
) => { |
||||
if (String(value).search(/[^a-zA-Zа-яА-я0-9а-яієїйьЇІ"'.)(, -]+/) !== -1) { |
||||
return options.message |
||||
? options.message |
||||
: '^common.validations.characters' |
||||
} |
||||
|
||||
return null |
||||
} |
||||
|
||||
export { validate, presenceCost } |
||||
@ -1,10 +1,16 @@
@@ -1,10 +1,16 @@
|
||||
export enum RouteKey { |
||||
Onboarding = 'Onboarding', |
||||
LanguageSelect = 'LanguageSelect', |
||||
Setting = 'Setting', |
||||
SettingsGroup = 'SettingsGroup', |
||||
Game = 'Game', |
||||
Loading = 'Loading', |
||||
Package = 'Package', |
||||
Packages = 'Packages', |
||||
Questions = 'Questions', |
||||
} |
||||
|
||||
export enum SettingsKey { |
||||
Settings = 'Settings', |
||||
PrivacyPolicy = 'PrivacyPolicy', |
||||
Purchases = 'Purchases', |
||||
WriteToUs = 'WriteToUs' |
||||
} |
||||
|
||||
@ -1,5 +1,3 @@
@@ -1,5 +1,3 @@
|
||||
export * from './custom-pack' |
||||
export * from './dare' |
||||
export * from './game-item' |
||||
export * from './page-titles' |
||||
export * from './truth' |
||||
|
||||
@ -1 +1,2 @@
@@ -1 +1,2 @@
|
||||
export * from './bottom-sheet-view.atom' |
||||
export * from './action-sheet-button.atom' |
||||
|
||||
@ -0,0 +1 @@
@@ -0,0 +1 @@
|
||||
export * from './sheets' |
||||
@ -1,2 +1,3 @@
@@ -1,2 +1,3 @@
|
||||
export * from './alert' |
||||
export * from './alert-confirm' |
||||
export * from './bottom-sheet' |
||||
|
||||
@ -1 +1,2 @@
@@ -1 +1,2 @@
|
||||
export * from './selected-language-in-settings.atom'; |
||||
export * from './selected-language-in-settings.atom' |
||||
export * from './switch-notifications.atom' |
||||
|
||||
@ -1,25 +1,21 @@
@@ -1,25 +1,21 @@
|
||||
import React from 'react'; |
||||
import {StyleSheet, Text, View} from 'react-native'; |
||||
import {useTranslation} from 'react-i18next'; |
||||
import React from 'react' |
||||
import { StyleSheet } from 'react-native' |
||||
import { useTranslation } from 'react-i18next' |
||||
import { $size, Txt, colors } from '../../common' |
||||
|
||||
export const SelectedLanguage = () => { |
||||
const {t, i18n} = useTranslation(); |
||||
return ( |
||||
<View style={styles.curentLang}> |
||||
<Text style={styles.text}>{i18n.language}</Text> |
||||
</View> |
||||
); |
||||
}; |
||||
const { i18n } = useTranslation() |
||||
|
||||
console.log(i18n.language) |
||||
|
||||
return <Txt style={styles.text}>{i18n.language}</Txt> |
||||
} |
||||
const styles = StyleSheet.create({ |
||||
curentLang: { |
||||
flex: 0, |
||||
alignSelf: 'center', |
||||
}, |
||||
text: { |
||||
color: '#A798FF', |
||||
fontWeight: '600', |
||||
fontSize: 18, |
||||
lineHeight: 28, |
||||
textTransform: 'uppercase', |
||||
}, |
||||
}); |
||||
text: { |
||||
color: colors.purple, |
||||
fontWeight: '600', |
||||
fontSize: $size(18), |
||||
lineHeight: $size(28), |
||||
textTransform: 'uppercase', |
||||
}, |
||||
}) |
||||
|
||||
@ -0,0 +1,22 @@
@@ -0,0 +1,22 @@
|
||||
import React, { useState } from 'react' |
||||
import { Switch } from 'react-native' |
||||
import { $size, colors } from '../../common' |
||||
|
||||
export const SwitchNotificationsAtom = () => { |
||||
const [isEnabled, setIsEnabled] = useState(false) |
||||
|
||||
const toggleSwitch = () => { |
||||
setIsEnabled(previousState => !previousState) |
||||
} |
||||
|
||||
return ( |
||||
<Switch |
||||
trackColor={{ true: colors.purple }} |
||||
thumbColor={isEnabled ? colors.turquoise : colors.darkPurple} |
||||
ios_backgroundColor={colors.purple} |
||||
onValueChange={toggleSwitch} |
||||
style={{ width: $size(51) }} |
||||
value={isEnabled} |
||||
/> |
||||
) |
||||
} |
||||
@ -1,2 +1,4 @@
@@ -1,2 +1,4 @@
|
||||
export * from './privacy-policy' |
||||
export * from './settings.screen' |
||||
export * from './purchases.screen' |
||||
export * from './write-to-us.screen' |
||||
|
||||
@ -0,0 +1,43 @@
@@ -0,0 +1,43 @@
|
||||
import React, { FC } from 'react' |
||||
import { useTranslation } from 'react-i18next' |
||||
import { StyleSheet, View } from 'react-native' |
||||
import { |
||||
$size, |
||||
ButtonPrimary, |
||||
colors, |
||||
Header, |
||||
ScreenLayout, |
||||
Txt, |
||||
useNav, |
||||
} from '../../common' |
||||
import { SheetManager } from 'react-native-actions-sheet' |
||||
|
||||
export const PurchasesScreen: FC = () => { |
||||
const { t } = useTranslation() |
||||
const nav = useNav() |
||||
|
||||
return ( |
||||
<ScreenLayout |
||||
headerComponent={ |
||||
<Header |
||||
leftIcon="arrow" |
||||
title={t('pageTitles.purchases')} |
||||
onPressLeft={() => nav.goBack()} |
||||
/> |
||||
}> |
||||
<View></View> |
||||
</ScreenLayout> |
||||
) |
||||
} |
||||
|
||||
const styles = StyleSheet.create({ |
||||
container: { |
||||
backgroundColor: colors.darkPurple, |
||||
borderRadius: 20, |
||||
padding: 20, |
||||
}, |
||||
description: { |
||||
color: colors.purple, |
||||
lineHeight: $size(30), |
||||
}, |
||||
}) |
||||
@ -0,0 +1,67 @@
@@ -0,0 +1,67 @@
|
||||
import React, { FC } from 'react' |
||||
import { useTranslation } from 'react-i18next' |
||||
import { StyleSheet } from 'react-native' |
||||
import { |
||||
$size, |
||||
appEvents, |
||||
ButtonPrimary, |
||||
colors, |
||||
FormTextControll, |
||||
Header, |
||||
ScreenLayout, |
||||
useForm, |
||||
useNav, |
||||
} from '../../common' |
||||
import { writeToUsValidator } from '../validator' |
||||
|
||||
interface WriteUsForm { |
||||
message: string |
||||
} |
||||
|
||||
export const WriteToUsScreen: FC = () => { |
||||
const { t } = useTranslation() |
||||
const nav = useNav() |
||||
const form = useForm<WriteUsForm>({}, writeToUsValidator) |
||||
|
||||
const onSendText = () => { |
||||
appEvents.emit('alert', { |
||||
title: 'Aga, thanks', |
||||
subtitle: 'We rozberemosya', |
||||
onClose: () => nav.goBack(), |
||||
}) |
||||
} |
||||
|
||||
return ( |
||||
<ScreenLayout |
||||
bottomSafeArea |
||||
headerComponent={ |
||||
<Header |
||||
leftIcon="arrow" |
||||
title={t('pageTitles.writeToUs')} |
||||
onPressLeft={() => nav.goBack()} |
||||
/> |
||||
}> |
||||
<FormTextControll |
||||
label={t('settingTranslation.label')} |
||||
value={form.values.message} |
||||
onChange={val => form.setFormField('message', val)} |
||||
inputProps={{ multiline: true }} |
||||
inputStyle={{ height: $size(100) }} |
||||
error={form.errors['message']} |
||||
/> |
||||
<ButtonPrimary |
||||
style={styles.button} |
||||
disabled={!form.values.message} |
||||
onPress={() => form.onSubmit(onSendText)}> |
||||
Send to us |
||||
</ButtonPrimary> |
||||
</ScreenLayout> |
||||
) |
||||
} |
||||
|
||||
const styles = StyleSheet.create({ |
||||
button: { |
||||
marginTop: $size(20), |
||||
backgroundColor: colors.lightPurple, |
||||
}, |
||||
}) |
||||
@ -0,0 +1 @@
@@ -0,0 +1 @@
|
||||
export * from './writeToUs.validator' |
||||
@ -0,0 +1,15 @@
@@ -0,0 +1,15 @@
|
||||
import validate from 'validate.js' |
||||
import { presenceCost } from '../../common' |
||||
|
||||
const constraints = { |
||||
message: { |
||||
presence: presenceCost, |
||||
length: { |
||||
minimum: 5, |
||||
}, |
||||
}, |
||||
} |
||||
|
||||
export const writeToUsValidator = (data: any) => { |
||||
return validate(data, constraints) |
||||
} |
||||
Loading…
Reference in new issue