rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: replace 'preact' with 'react' (#1048)

Browse Source
This commit is contained in:
Aman Harwara
2022-05-30 12:42:52 +05:30
committed by GitHub
parent e74b4953ea
commit 8c368dd96b
231 changed files with 4794 additions and 4302 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
app/assets/javascripts/Components/Preferences/Panes/Security/Encryption.tsx
View File

@@ -1,54 +1,15 @@
import { Icon } from '@/Components/Icon/Icon'
import { STRING_E2E_ENABLED, STRING_ENC_NOT_ENABLED, STRING_LOCAL_ENC_ENABLED } from '@/Strings'
import { AppState } from '@/UIModels/AppState'
import { observer } from 'mobx-react-lite'
import { ComponentChild, FunctionComponent } from 'preact'
import { PreferencesGroup, PreferencesSegment, Text, Title } from '@/Components/Preferences/PreferencesComponents'
import { FunctionComponent } from 'react'
import { Title, Text } from '../../PreferencesComponents/Content'
import PreferencesGroup from '../../PreferencesComponents/PreferencesGroup'
import PreferencesSegment from '../../PreferencesComponents/PreferencesSegment'
import EncryptionEnabled from './EncryptionEnabled'
const formatCount = (count: number, itemType: string) => `${count} / ${count} ${itemType}`
type Props = { appState: AppState }
export const EncryptionStatusItem: FunctionComponent<{
icon: ComponentChild
status: string
checkmark?: boolean
}> = ({ icon, status, checkmark = true }) => (
<div className="w-full rounded py-1.5 px-3 text-input my-1 min-h-8 flex flex-row items-center bg-contrast no-border focus-within:ring-info">
{icon}
<div className="min-w-3 min-h-1" />
<div className="flex-grow color-text text-sm">{status}</div>
<div className="min-w-3 min-h-1" />
{checkmark && <Icon className="success min-w-4 min-h-4" type="check-bold" />}
</div>
)
const EncryptionEnabled: FunctionComponent<{ appState: AppState }> = observer(({ appState }) => {
const count = appState.accountMenu.structuredNotesAndTagsCount
const notes = formatCount(count.notes, 'notes')
const tags = formatCount(count.tags, 'tags')
const archived = formatCount(count.archived, 'archived notes')
const deleted = formatCount(count.deleted, 'trashed notes')
const noteIcon = <Icon type="rich-text" className="min-w-5 min-h-5" />
const tagIcon = <Icon type="hashtag" className="min-w-5 min-h-5" />
const archiveIcon = <Icon type="archive" className="min-w-5 min-h-5" />
const trashIcon = <Icon type="trash" className="min-w-5 min-h-5" />
return (
<>
<div className="flex flex-row items-start pb-1 pt-1.5">
<EncryptionStatusItem status={notes} icon={[noteIcon]} />
<div className="min-w-3" />
<EncryptionStatusItem status={tags} icon={[tagIcon]} />
</div>
<div className="flex flex-row items-start">
<EncryptionStatusItem status={archived} icon={[archiveIcon]} />
<div className="min-w-3" />
<EncryptionStatusItem status={deleted} icon={[trashIcon]} />
</div>
</>
)
})
export const Encryption: FunctionComponent<{ appState: AppState }> = observer(({ appState }) => {
const Encryption: FunctionComponent<Props> = ({ appState }) => {
const app = appState.application
const hasUser = app.hasAccount()
const hasPasscode = app.hasPasscode()
@@ -70,4 +31,6 @@ export const Encryption: FunctionComponent<{ appState: AppState }> = observer(({
</PreferencesSegment>
</PreferencesGroup>
)
})
}
export default observer(Encryption)