This commit is contained in:
		
							parent
							
								
									f56b92fff0
								
							
						
					
					
						commit
						5d6eb7282a
					
				
					 9 changed files with 48 additions and 110 deletions
				
			
		| 
						 | 
				
			
			@ -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);
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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>
 | 
			
		||||
                  );
 | 
			
		||||
                }}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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}>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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>
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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>
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue