feat(core): selector for editorSetting hooks (#8108)

This commit is contained in:
EYHN 2024-09-05 08:44:10 +00:00
parent 3837c84791
commit 691bfed185
No known key found for this signature in database
GPG Key ID: 46C9E26A75AB276C
5 changed files with 20 additions and 10 deletions

View File

@ -603,7 +603,9 @@ export const PagePropertiesTableHeader = ({
const docBacklinks = docLinksServices.backlinks;
const backlinks = useLiveData(docBacklinks.backlinks$);
const settings = useLiveData(editorSettingService.editorSetting.settings$);
const displayDocInfo = useLiveData(
editorSettingService.editorSetting.settings$.selector(s => s.displayDocInfo)
);
const { syncing, retrying, serverClock } = useLiveData(
workspaceService.workspace.engine.doc.docState$(docService.doc.id)
@ -696,7 +698,7 @@ export const PagePropertiesTableHeader = ({
{dTimestampElement}
</div>
<Divider />
{settings.displayDocInfo ? (
{displayDocInfo ? (
<div className={styles.tableHeaderSecondaryRow}>
<div className={clsx(!open ? styles.pageInfoDimmed : null)}>
{t['com.affine.page-properties.page-info']()}

View File

@ -191,7 +191,11 @@ export const BlocksuiteDocEditor = forwardRef<
const [specs, portals] = usePatchSpecs(page, !!shared, 'page');
const settings = useLiveData(editorSettingService.editorSetting.settings$);
const displayBiDirectionalLink = useLiveData(
editorSettingService.editorSetting.settings$.selector(
s => s.displayBiDirectionalLink
)
);
return (
<>
@ -210,7 +214,7 @@ export const BlocksuiteDocEditor = forwardRef<
hasViewport={false}
/>
<div className={styles.docEditorGap} onClick={onClickBlank}></div>
{!shared && settings.displayBiDirectionalLink ? (
{!shared && displayBiDirectionalLink ? (
<BiDirectionalLinkPanel />
) : null}
</div>

View File

@ -92,7 +92,9 @@ export const PeekViewModalContainer = forwardRef<
const controlsRef = useRef<HTMLDivElement>(null);
const prevAnimeMap = useRef<Record<string, AnimeInstance | undefined>>({});
const editorSettings = useService(EditorSettingService).editorSetting;
const settings = useLiveData(editorSettings.settings$);
const fullWidthLayout = useLiveData(
editorSettings.settings$.selector(s => s.fullWidthLayout)
);
const animateControls = useCallback((animateIn = false) => {
const controls = controlsRef.current;
@ -322,7 +324,7 @@ export const PeekViewModalContainer = forwardRef<
>
<div
data-anime-state={animeState}
data-full-width-layout={settings.fullWidthLayout}
data-full-width-layout={fullWidthLayout}
ref={contentClipRef}
className={styles.modalContentContainer}
>

View File

@ -187,8 +187,8 @@ export const SignOutConfirmModal = () => {
export const AIReloadConfirmModal = () => {
const editorSettingService = useService(EditorSettingService);
const enableAI = useLiveData(
editorSettingService.editorSetting.settings$
).enableAI;
editorSettingService.editorSetting.settings$.selector(s => s.enableAI)
);
const [aiState] = useState(enableAI);
const [open, setOpen] = useState(false);

View File

@ -13,7 +13,9 @@ import { RowLayout } from '../row.layout';
export const FontStyleSetting = () => {
const t = useI18n();
const editorSetting = useService(EditorSettingService).editorSetting;
const settings = useLiveData(editorSetting.settings$);
const fontFamily = useLiveData(
editorSetting.settings$.selector(s => s.fontFamily)
);
const options = useMemo(() => getBaseFontStyleOptions(t), [t]);
const handleEdit = useCallback(
@ -27,7 +29,7 @@ export const FontStyleSetting = () => {
<RowLayout label={t['com.affine.mobile.setting.appearance.font']()}>
<SettingDropdownSelect<FontFamily>
options={options}
value={settings.fontFamily}
value={fontFamily}
onChange={handleEdit}
/>
</RowLayout>