Rubicon/tutu
1
0
Fork 0
Code Issues 18 Pull requests Projects Activity Actions

use innerHTML property
All checks were successful
/ depoly (push) Successful in 1m18s
Details

Browse source
This commit is contained in:
thislight 2024-11-24 17:16:06 +08:00
parent f56b92fff0
commit 5d6eb7282a
No known key found for this signature in database
GPG key ID: FCFE5192241CCD4E
9 changed files with 48 additions and 110 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/masto/toot.ts
View file

@ -20,17 +20,6 @@ export function resolveCustomEmoji(
});
}
export function appliedCustomEmoji(
target: { innerHTML: string },
content: string,
emojis?: mastodon.v1.CustomEmoji[],
) {
createRenderEffect(() => {
const result = emojis ? resolveCustomEmoji(content, emojis) : content;
target.innerHTML = result;
});
}
export function hasCustomEmoji(s: string) {
return CUSTOM_EMOJI_REGEX.test(s);
}

26
src/profiles/Profile.tsx
View file

@ -171,10 +171,6 @@ const Profile: Component = () => {
),
);
const useSessionDisplayName = (e: HTMLElement) => {
createRenderEffect(() => (e.innerHTML = sessionDisplayName()));
};
const toggleSubscribeHome = async (event: Event) => {
const client = session().client;
if (!session().account) return;
@ -218,9 +214,7 @@ const Profile: Component = () => {
style={{
visibility: scrolledPastBanner() ? undefined : "hidden",
}}
ref={(e: HTMLElement) =>
createRenderEffect(() => (e.innerHTML = displayName()))
}
innerHTML={displayName()}
></Title>
<IconButton
@ -253,7 +247,7 @@ const Profile: Component = () => {
<Avatar src={session().account?.inf?.avatar} />
</ListItemAvatar>
<ListItemText secondary={"Default account"}>
<span ref={useSessionDisplayName}></span>
<span innerHTML={sessionDisplayName()}></span>
</ListItemText>
{/* <ArrowRight /> // for future */}
</MenuItem>
@ -384,7 +378,7 @@ const Profile: Component = () => {
: undefined
}
>
<span ref={useSessionDisplayName}></span>
<span innerHTML={sessionDisplayName()}></span>
<span>'s Home</span>
</ListItemText>
@ -419,9 +413,7 @@ const Profile: Component = () => {
</Show>
<Body2
component="span"
ref={(e: HTMLElement) =>
createRenderEffect(() => (e.innerHTML = displayName()))
}
innerHTML={displayName()}
aria-label="Display name"
></Body2>
</div>
@ -464,9 +456,7 @@ const Profile: Component = () => {
<section
class="description"
aria-label={`${profile()?.displayName || "the user"}'s description`}
ref={(e) =>
createRenderEffect(() => (e.innerHTML = description() || ""))
}
innerHTML={description() || ""}
></section>
<table
@ -484,11 +474,7 @@ const Profile: Component = () => {
<Verified />
</Show>
</td>
<td
ref={(e) => {
createRenderEffect(() => (e.innerHTML = item.value));
}}
></td>
<td innerHTML={item.value}></td>
</tr>
);
}}

20
src/timelines/RegularToot.tsx
View file

@ -66,9 +66,7 @@ export function findRootToot(element: HTMLElement) {
current = current.parentElement;
}
if (!current) {
throw Error(
`the element must be placed under a element with .RegularToot`,
);
throw Error(`the element must be placed under a element with .RegularToot`);
}
return current;
}
@ -145,8 +143,8 @@ const RegularToot: Component<RegularTootProps> = (oprops) => {
<>
<article
classList={{
"RegularToot": true,
"expanded": props.evaluated,
RegularToot: true,
expanded: props.evaluated,
"thread-top": props.thread === "top",
"thread-mid": props.thread === "middle",
"thread-btm": props.thread === "bottom",
@ -160,14 +158,10 @@ const RegularToot: Component<RegularTootProps> = (oprops) => {
<div class="retoot-grp">
<BoostIcon />
<Body2
ref={(e: { innerHTML: string }) => {
createRenderEffect(() => {
e.innerHTML = resolveCustomEmoji(
status().account.displayName,
toot().emojis,
);
});
}}
innerHTML={resolveCustomEmoji(
status().account.displayName,
toot().emojis,
)}
></Body2>
<span>boosts</span>
</div>

8
src/timelines/TootBottomSheet.tsx
View file

@ -261,13 +261,7 @@ const TootBottomSheet: Component = (props) => {
>
<BackButton color="inherit" />
<Title component="div" class="name" use:solid-styled>
<span
ref={(e: HTMLElement) =>
createRenderEffect(
() => (e.innerHTML = tootDisplayName() ?? "Someone"),
)
}
></span>
<span innerHTML={tootDisplayName() ?? "Someone"}></span>
<span>'s toot</span>
</Title>
</Toolbar>

13
src/timelines/TootComposer.tsx
View file

@ -349,15 +349,10 @@ const TootComposer: Component<{
</ListItemAvatar>
<ListItemText secondary={"Default account"}>
<span
ref={(e) => {
createRenderEffect(() => {
const inf = session()?.account.inf;
return (e.innerHTML = resolveCustomEmoji(
inf?.displayName || "",
inf?.emojis ?? [],
));
});
}}
innerHTML={resolveCustomEmoji(
session()?.account.inf?.displayName || "",
session()?.account.inf?.emojis ?? [],
)}
></span>
</ListItemText>
</MenuItem>

12
src/timelines/toots/TootAuthorGroup.tsx
View file

@ -31,14 +31,10 @@ function TootAuthorGroup(
</Show>
<Body2
component="span"
ref={(e: { innerHTML: string }) => {
createRenderEffect(() => {
e.innerHTML = resolveCustomEmoji(
toot().account.displayName,
toot().account.emojis,
);
});
}}
innerHTML={resolveCustomEmoji(
toot().account.displayName,
toot().account.emojis,
)}
/>
</div>
<time datetime={toot().createdAt}>

30
src/timelines/toots/TootContent.tsx
View file

@ -81,15 +81,13 @@ const TootContent: Component<TootContentProps> = (oprops) => {
<Show when={props.sensitive}>
<div>
<span
ref={(ref) => {
createRenderEffect(() => {
ref.innerHTML = props.spoilerText
? props.emojis
? resolveCustomEmoji(props.spoilerText, props.emojis)
: props.spoilerText
: "";
});
}}
innerHTML={
props.spoilerText
? props.emojis
? resolveCustomEmoji(props.spoilerText, props.emojis)
: props.spoilerText
: ""
}
></span>
<Button onClick={props.onToggleReveal}>{t("cw")}</Button>
</div>
@ -97,14 +95,12 @@ const TootContent: Component<TootContentProps> = (oprops) => {
<Show when={shouldRevealContent()}>
<div
class="content"
ref={(ref) =>
createRenderEffect(() => {
ref.innerHTML = props.source
? props.emojis
? resolveCustomEmoji(props.source, props.emojis)
: props.source
: "";
})
innerHTML={
props.source
? props.emojis
? resolveCustomEmoji(props.source, props.emojis)
: props.source
: ""
}
></div>
</Show>

25
src/timelines/toots/TootPoll.tsx
View file

@ -20,10 +20,7 @@ import {
ListItemText,
Radio,
} from "@suid/material";
import {
formatDistance,
isBefore,
} from "date-fns";
import { formatDistance, isBefore } from "date-fns";
import { useTimeSource } from "~platform/timesrc";
import { useDateFnLocale } from "~platform/i18n";
import TootPollDialog from "./TootPollDialog";
@ -31,13 +28,13 @@ import { ANIM_CURVE_STD } from "~material/theme";
import { useTootEnv } from "../RegularToot";
type TootPollProps = {
value: mastodon.v1.Poll
status: mastodon.v1.Status
value: mastodon.v1.Poll;
status: mastodon.v1.Status;
};
const TootPoll: Component<TootPollProps> = (props) => {
let list: HTMLUListElement;
const {vote}= useTootEnv()
const { vote } = useTootEnv();
const now = useTimeSource();
const dateFnLocale = useDateFnLocale();
@ -46,7 +43,7 @@ const TootPoll: Component<TootPollProps> = (props) => {
const [initialVote, setInitialVote] = createSignal(0);
const poll = () => props.value
const poll = () => props.value;
const isShowResult = () => {
const n = mustShowResult();
@ -118,14 +115,10 @@ const TootPoll: Component<TootPollProps> = (props) => {
>
<ListItemText>
<span
ref={(e) =>
createRenderEffect(() => {
e.innerHTML = resolveCustomEmoji(
option().title,
option().emojis,
);
})
}
innerHTML={resolveCustomEmoji(
option().title,
option().emojis,
)}
></span>
</ListItemText>

13
src/timelines/toots/TootPollDialog.tsx
View file

@ -96,15 +96,10 @@ const TootPollDialog: Component<TootPollDialogPoll> = (props) => {
>
<ListItemText>
<span
ref={(e) =>
createRenderEffect(
() =>
(e.innerHTML = resolveCustomEmoji(
option().title,
option().emojis,
)),
)
}
innerHTML={resolveCustomEmoji(
option().title,
option().emojis,
)}
></span>
</ListItemText>