pinmenote.com
/
pinmenote-extension
1
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Projects Releases Wiki Activity

feat: expert mode show indexed words

This commit is contained in:
Michal Szczepanski 2023-09-27 05:16:47 +02:00
parent 235adf90fc
commit 52978a2892
10 changed files with 36 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/common/environment.ts
View File

@ -33,6 +33,7 @@ export interface SettingsConfig {
borderRadius: string;
themeColor: string;
skipCssImageSizeMB: number;
expertMode: boolean;
history: SettingsHistoryConfig;
}
@ -57,6 +58,7 @@ export const environmentConfig: EnvironmentConfig = {
borderRadius: '5px',
themeColor: '#ff0000',
skipCssImageSizeMB: 2,
expertMode: false,
history: {
pinComment: true,
pinDraw: true,

1
src/common/keys/object.store.keys.ts
View File

@ -49,7 +49,6 @@ export class ObjectStoreKeys {
// SYNC
static readonly SYNC_INTERVAL = 'sync:interval';
static readonly SYNC_PROGRESS = 'sync:progress';
static readonly SYNC_IN = 'sync:obj:in';
static readonly SYNC_TX = 'sync:tx';
// SETTINGS

2
src/default-popup/components/account/account-details.component.tsx
View File

@ -124,7 +124,7 @@ export const AccountDetailsComponent: FunctionComponent<Props> = (props) => {
</div>
</div>
<div style={{ position: 'absolute', bottom: 0, width: 300 }}>
<div style={{ position: 'absolute', bottom: 32, width: 300 }}>
<div style={{ margin: 10 }}>
<Typography style={{ fontSize: '8pt', color: COLOR_DEFAULT_RED }}>
{responseError?.code} {responseError?.message}

2
src/default-popup/components/main/main-footer.button.tsx
View File

@ -26,7 +26,7 @@ interface Props {
export const MainFooterButton: FunctionComponent<Props> = (props) => {
return (
<div style={{ position: 'absolute', bottom: 0, width: 300, paddingTop: 5, backgroundColor: '#ffffff' }}>
<div style={{ position: 'absolute', bottom: 32, width: 300, paddingTop: 5, backgroundColor: '#ffffff' }}>
<div
style={{
display: props.openBugReport ? 'flex' : 'none',

7
src/options-ui/components/board/board/board-item-footer.tsx
View File

@ -25,6 +25,7 @@ import { TagEditor } from '../../tag-editor/tag-editor';
import TagIcon from '@mui/icons-material/Tag';
import Typography from '@mui/material/Typography';
import dayjs from 'dayjs';
import { SettingsStore } from '../../../store/settings.store';
interface Props {
title: string;
@ -60,7 +61,11 @@ export const BoardItemFooter: FunctionComponent<Props> = (props) => {
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
<p>{dayjs(props.createdAt).format(DATE_YEAR_SECOND)}</p>
<div style={{ display: 'flex', alignItems: 'center' }}>
<IconButton onClick={handleWordsIconClick} title="Show / Hide indexed words">
<IconButton
onClick={handleWordsIconClick}
title="Show / Hide indexed words"
style={{ display: SettingsStore.settings?.expertMode ? 'flex' : 'none' }}
>
<DataArrayIcon style={{ color: wordsVisible ? COLOR_DEFAULT_RED : COLOR_DEFAULT_GREY }} />
</IconButton>
<IconButton title="Show / Hide tags" onClick={handleTagIconClick}>

2
src/options-ui/components/preview/html-preview.component.tsx
View File

@ -90,8 +90,6 @@ export const HtmlPreviewComponent: FunctionComponent<Props> = (props) => {
const el = htmlRef.current?.lastElementChild as HTMLIFrameElement;
if (!el.contentDocument || !el.contentWindow) return;
await SettingsStore.fetchData();
fnConsoleLog('HtmlPreviewComponent->renderPins', ids);
for (const id of ids) {

24
src/options-ui/components/settings/content/content-settings.component.tsx
View File

@ -22,6 +22,7 @@ import { ObjectStoreKeys } from '../../../../common/keys/object.store.keys';
import { SettingsConfig } from '../../../../common/environment';
import { SettingsStore } from '../../../store/settings.store';
import Typography from '@mui/material/Typography';
import Checkbox from '@mui/material/Checkbox';
const borderContainer: CSSProperties = {
display: 'flex',
@ -32,13 +33,13 @@ const borderContainer: CSSProperties = {
export const ContentSettingsComponent: FunctionComponent = () => {
const [borderRadius, setBorderRadius] = useState<string>('');
const [borderStyle, setBorderStyle] = useState<string>('');
const [expertMode, setExpertMode] = useState<boolean>(false);
useEffect(() => {
setTimeout(async () => {
await SettingsStore.fetchData();
setBorderRadius(SettingsStore.settings?.borderRadius || `${DEFAULT_BORDER_RADIUS}px`);
setBorderStyle(SettingsStore.settings?.borderStyle || '2px solid #ff0000');
}, 0);
if (!SettingsStore.settings) return;
setBorderRadius(SettingsStore.settings.borderRadius || `${DEFAULT_BORDER_RADIUS}px`);
setBorderStyle(SettingsStore.settings.borderStyle || '2px solid #ff0000');
setExpertMode(SettingsStore.settings.expertMode || false);
}, []);
const handleBorderRadiusChange = async (e: ChangeEvent<HTMLInputElement>): Promise<void> => {
@ -55,6 +56,13 @@ export const ContentSettingsComponent: FunctionComponent = () => {
await BrowserStorage.set<SettingsConfig>(ObjectStoreKeys.CONTENT_SETTINGS_KEY, SettingsStore.settings);
};
const handleExpertModeChange = async () => {
if (!SettingsStore.settings) return;
setExpertMode(!expertMode);
SettingsStore.settings.expertMode = !expertMode;
await BrowserStorage.set<SettingsConfig>(ObjectStoreKeys.CONTENT_SETTINGS_KEY, SettingsStore.settings);
};
return (
<div>
<Typography fontSize="2.5em" style={{ marginBottom: 10 }}>
@ -75,6 +83,12 @@ export const ContentSettingsComponent: FunctionComponent = () => {
</Typography>
<Input type="text" value={borderStyle} onChange={handleBorderStyleChange} style={{ width: 300 }} />
</div>
<div style={borderContainer}>
<Typography fontSize="2em" textAlign="right" width={150} style={{ marginRight: 20 }}>
expert mode
</Typography>
<Checkbox checked={expertMode} onChange={handleExpertModeChange} />
</div>
</div>
);
};

8
src/options-ui/components/settings/screenshot/screenshot-settings.component.tsx
View File

@ -36,11 +36,9 @@ export const ScreenshotSettingsComponent: FunctionComponent = () => {
const [screenshotQuality, setScreenshotQuality] = useState<number>(0);
useEffect(() => {
setTimeout(async () => {
await SettingsStore.fetchData();
setScreenshotQuality(SettingsStore.settings?.screenshotQuality || 0);
setScreenshotFormat(SettingsStore.settings?.screenshotFormat || 'jpeg');
}, 0);
if (!SettingsStore.settings) return;
setScreenshotQuality(SettingsStore.settings.screenshotQuality || 0);
setScreenshotFormat(SettingsStore.settings.screenshotFormat || 'jpeg');
}, []);
const handleScreenshotQuality = async (e: ChangeEvent<HTMLInputElement>): Promise<void> => {

4
src/options-ui/options-message.handler.ts
View File

@ -19,6 +19,7 @@ import { BusMessageType } from '../common/model/bus.model';
import { ExtensionPopupInitData } from '../common/model/obj-request.model';
import { TinyDispatcher } from '@pinmenote/tiny-dispatcher';
import { fnConsoleLog } from '../common/fn/fn-console';
import { SettingsStore } from './store/settings.store';
export class OptionsMessageHandler {
static init(): void {
@ -27,6 +28,9 @@ export class OptionsMessageHandler {
BrowserApi.sendRuntimeMessage({ type: BusMessageType.OPTIONS_SYNC_INCOMING_CHANGES }).catch((e) =>
fnConsoleLog('OPTIONS_SYNC_INCOMING_CHANGES->ERROR', e)
);
SettingsStore.fetchData().catch(() => {
/* IGNORE */
});
}
private static handleRemoteMessage = (

2
src/service-worker/command/sw/sw-init-settings.command.ts
View File

@ -16,7 +16,6 @@
*/
import { SettingsConfig, environmentConfig } from '../../../common/environment';
import { BrowserStorage } from '@pinmenote/browser-api';
import { CryptoGenerateKeyPairCommand } from '../../../common/command/crypto/crypto-generate-key-pair.command';
import { ICommand } from '../../../common/model/shared/common.dto';
import { ObjectStoreKeys } from '../../../common/keys/object.store.keys';
import { fnConsoleLog } from '../../../common/fn/fn-console';
@ -27,7 +26,6 @@ export class SwInitSettingsCommand implements ICommand<Promise<void>> {
if (!settings) {
fnConsoleLog('Settings Initialize');
await BrowserStorage.set<SettingsConfig>(ObjectStoreKeys.CONTENT_SETTINGS_KEY, environmentConfig.settings);
await new CryptoGenerateKeyPairCommand().execute();
} else if (settings.version !== environmentConfig.settings.version) {
fnConsoleLog('Settings Migrate placeholder');
} else {