add quizId as App prop and widget param
This commit is contained in:
parent
1e3fc3ae26
commit
3f43b1bfaa
16
src/App.tsx
16
src/App.tsx
@ -9,14 +9,18 @@ import { ViewPage } from "./pages/ViewPublicationPage";
|
|||||||
import lightTheme from "./utils/themes/light";
|
import lightTheme from "./utils/themes/light";
|
||||||
|
|
||||||
|
|
||||||
|
const defaultQuizId = "ef836ff8-35b1-4031-9acf-af5766bac2b2";
|
||||||
|
|
||||||
moment.locale("ru");
|
moment.locale("ru");
|
||||||
const localeText = ruRU.components.MuiLocalizationProvider.defaultProps.localeText;
|
const localeText = ruRU.components.MuiLocalizationProvider.defaultProps.localeText;
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
widget?: boolean;
|
widget?: boolean;
|
||||||
|
quizId?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function App({ widget = false }: Props) {
|
export default function App({ widget = false, quizId }: Props) {
|
||||||
|
quizId ??= defaultQuizId;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SWRConfig value={{
|
<SWRConfig value={{
|
||||||
@ -30,20 +34,20 @@ export default function App({ widget = false }: Props) {
|
|||||||
style={{ backgroundColor: lightTheme.palette.brightPurple.main }}
|
style={{ backgroundColor: lightTheme.palette.brightPurple.main }}
|
||||||
>
|
>
|
||||||
<CssBaseline />
|
<CssBaseline />
|
||||||
{widget ?
|
{widget ? (
|
||||||
<Box sx={{
|
<Box sx={{
|
||||||
width: "100%",
|
width: "100%",
|
||||||
height: "100%",
|
height: "100%",
|
||||||
}}>
|
}}>
|
||||||
<ViewPage />
|
<ViewPage quizId={quizId} />
|
||||||
</Box>
|
</Box>
|
||||||
:
|
) : (
|
||||||
<Box sx={{
|
<Box sx={{
|
||||||
height: "100dvh",
|
height: "100dvh",
|
||||||
}}>
|
}}>
|
||||||
<ViewPage />
|
<ViewPage quizId={quizId} />
|
||||||
</Box>
|
</Box>
|
||||||
}
|
)}
|
||||||
</SnackbarProvider>
|
</SnackbarProvider>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
</LocalizationProvider>
|
</LocalizationProvider>
|
||||||
|
@ -12,19 +12,15 @@ import { ApologyPage } from "./ApologyPage";
|
|||||||
import { Question } from "./Question";
|
import { Question } from "./Question";
|
||||||
import { StartPageViewPublication } from "./StartPageViewPublication";
|
import { StartPageViewPublication } from "./StartPageViewPublication";
|
||||||
|
|
||||||
|
|
||||||
import { parseQuizData } from "@model/api/getQuizData";
|
import { parseQuizData } from "@model/api/getQuizData";
|
||||||
import { replaceSpacesToEmptyLines } from "./tools/replaceSpacesToEmptyLines";
|
import { replaceSpacesToEmptyLines } from "./tools/replaceSpacesToEmptyLines";
|
||||||
|
|
||||||
const QID =
|
type Props = {
|
||||||
import.meta.env.PROD ?
|
quizId: string;
|
||||||
window.location.pathname.replace(/\//g, '')
|
};
|
||||||
:
|
|
||||||
"ef836ff8-35b1-4031-9acf-af5766bac2b2";
|
|
||||||
|
|
||||||
|
export const ViewPage = ({ quizId }: Props) => {
|
||||||
export const ViewPage = () => {
|
const { isLoading, error } = useSWR(["quizData", quizId], params => getQuizData(params[1]), {
|
||||||
const { isLoading, error } = useSWR(["quizData", QID], params => getQuizData(params[1]), {
|
|
||||||
onSuccess: setQuizData,
|
onSuccess: setQuizData,
|
||||||
});
|
});
|
||||||
const { settings, items, recentlyСompleted } = useQuestionsStore();
|
const { settings, items, recentlyСompleted } = useQuestionsStore();
|
||||||
|
@ -5,15 +5,16 @@ import App from "./App";
|
|||||||
let root: Root | undefined = undefined;
|
let root: Root | undefined = undefined;
|
||||||
|
|
||||||
const widget = {
|
const widget = {
|
||||||
create({ selector }: {
|
create({ selector, quizId }: {
|
||||||
selector: string;
|
selector: string;
|
||||||
|
quizId: string;
|
||||||
}) {
|
}) {
|
||||||
const element = document.getElementById(selector);
|
const element = document.getElementById(selector);
|
||||||
if (!element) throw new Error("Element for widget doesn't exist");
|
if (!element) throw new Error("Element for widget doesn't exist");
|
||||||
|
|
||||||
root = createRoot(element);
|
root = createRoot(element);
|
||||||
|
|
||||||
root.render(<App widget />);
|
root.render(<App widget quizId={quizId} />);
|
||||||
},
|
},
|
||||||
unmount() {
|
unmount() {
|
||||||
if (root) root.unmount();
|
if (root) root.unmount();
|
||||||
@ -27,7 +28,8 @@ export default widget;
|
|||||||
import widget from ".../widget.js";
|
import widget from ".../widget.js";
|
||||||
|
|
||||||
widget.create({
|
widget.create({
|
||||||
selector: "widget-container"
|
selector: "widget-container",
|
||||||
|
quizId: "...",
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
*/
|
*/
|
||||||
|
Loading…
Reference in New Issue
Block a user