|
1 | | -import React from 'react'; |
| 1 | +import React, { useState } from "react"; |
2 | 2 | import { useFragment } from 'react-relay'; |
3 | 3 |
|
4 | | -const CommentComponent = ({ commentRef }) => { |
5 | | - const commentData = useFragment( |
6 | | - graphql` |
7 | | - fragment CommentComponent_comment on Comment { |
8 | | - id |
9 | | - text |
10 | | - } |
11 | | - `, |
12 | | - commentRef |
13 | | - ); // $ Source=[js/xss] |
| 4 | +const func1 = ({ commentRef, query }) => { |
| 5 | + const commentData = useFragment(query, commentRef); // $ Source=[js/xss] |
| 6 | + return ( |
| 7 | + <p dangerouslySetInnerHTML={{ __html: commentData.text }}> // $ Alert=[js/xss] |
| 8 | + {" "} |
| 9 | + {commentData.text} |
| 10 | + </p> |
| 11 | + ); |
| 12 | +}; |
| 13 | + |
| 14 | +import { useLazyLoadQuery } from "react-relay"; |
14 | 15 |
|
| 16 | +function func2({ query }) { |
| 17 | + const data = useLazyLoadQuery(query, {}); // $ Missing: Source |
| 18 | + return <p dangerouslySetInnerHTML={{ __html: data.comments[0].text }} />; // $ Missing: Alert |
| 19 | +} |
| 20 | + |
| 21 | +import { useQueryLoader, usePreloadedQuery } from "react-relay"; |
| 22 | + |
| 23 | +function func3({ initialQueryRef, query }) { |
| 24 | + const [queryReference, loadQuery] = useQueryLoader(query, initialQueryRef); |
15 | 25 | return ( |
16 | | - <div> |
17 | | - <h3>Comment:</h3> |
18 | | - {/* Directly rendering user input without sanitation */} |
19 | | - <p dangerouslySetInnerHTML = {{ __html: commentData.text}}> {commentData.text}</p> // $ Alert=[js/xss] |
20 | | - </div> |
| 26 | + <h1 |
| 27 | + dangerouslySetInnerHTML={{ |
| 28 | + __html: usePreloadedQuery(query, queryReference).user?.name, // $ Missing: Alert |
| 29 | + }} |
| 30 | + /> |
| 31 | + ); |
| 32 | +} |
| 33 | + |
| 34 | +import { useClientQuery } from "react-relay"; |
| 35 | + |
| 36 | +function func4({ query }) { |
| 37 | + const data = useClientQuery(query, {}); // $ Missing: Source |
| 38 | + return <h1 dangerouslySetInnerHTML={{ __html: data }} />; // $ Missing: Alert |
| 39 | +} |
| 40 | + |
| 41 | +import { useRefetchableFragment } from "react-relay"; |
| 42 | + |
| 43 | +function func5({ query, props }) { |
| 44 | + const [data, refetch] = useRefetchableFragment(query, props.comment); // $ Missing: Source |
| 45 | + return ( |
| 46 | + <> |
| 47 | + <h1 dangerouslySetInnerHTML={{ __html: data }} /> // $ Missing: Alert |
| 48 | + <Button |
| 49 | + onClick={() => { |
| 50 | + refetch({ lang: "SPANISH" }, { fetchPolicy: "store-or-network" }); |
| 51 | + }} |
| 52 | + ></Button> |
| 53 | + </> |
21 | 54 | ); |
22 | | -}; |
| 55 | +} |
| 56 | + |
| 57 | +import { usePaginationFragment } from "react-relay"; |
| 58 | + |
| 59 | +function func6({ query }) { |
| 60 | + const { |
| 61 | + data, |
| 62 | + loadNext, |
| 63 | + loadPrevious, |
| 64 | + hasNext, |
| 65 | + hasPrevious, |
| 66 | + isLoadingNext, |
| 67 | + isLoadingPrevious, |
| 68 | + refetch, |
| 69 | + } = usePaginationFragment(query, {}); // $ Missing: Source |
| 70 | + return <h1 dangerouslySetInnerHTML={{ __html: data }} />; // $ Missing: Alert |
| 71 | +} |
| 72 | + |
| 73 | + |
| 74 | +import { useMutation } from 'react-relay'; |
| 75 | +import type { FeedbackLikeMutation } from './FeedbackLikeMutation.graphql'; |
| 76 | + |
| 77 | +function func7(query) { |
| 78 | + const [commit, inFlight] = useMutation<FeedbackLikeMutation>(query); |
| 79 | + const [feedbackText, setFeedbackText] = useState(''); |
| 80 | + |
| 81 | + commit({ |
| 82 | + onCompleted(data) { // $ Missing: Source |
| 83 | + setFeedbackText(data); |
| 84 | + }, |
| 85 | + }); |
| 86 | + |
| 87 | + return (<div dangerouslySetInnerHTML={{__html: feedbackText, }}/>); // $ Missing: Alert |
| 88 | +} |
| 89 | + |
| 90 | +import { useSubscription } from 'react-relay'; |
| 91 | +import { useMemo } from 'react'; |
| 92 | + |
| 93 | +function func8({GroupLessonsSubscription}) { |
| 94 | + const [fragmentRef, setFragmentRef] = useState(); |
| 95 | + |
| 96 | + const groupLessonConfig = useMemo(() => ({ |
| 97 | + subscription: GroupLessonsSubscription, |
| 98 | + variables: {}, |
| 99 | + onNext: (res) => { // $ Missing: Source |
| 100 | + setFragmentRef(res); |
| 101 | + }, |
| 102 | + onError: (err) => { |
| 103 | + console.error('Error with subscription:', err); |
| 104 | + }, |
| 105 | + onCompleted: () => { |
| 106 | + console.log('Subscription completed'); |
| 107 | + }, |
| 108 | + }), []); |
| 109 | + |
| 110 | + useSubscription(groupLessonConfig); |
| 111 | + |
| 112 | +return (<div dangerouslySetInnerHTML={{__html: fragmentRef, }}/>); // $ Missing: Alert |
| 113 | +} |
| 114 | + |
| 115 | + |
| 116 | +import { fetchQuery } from 'react-relay' |
| 117 | + |
| 118 | +function func9({query, environment}) { |
| 119 | + fetchQuery(environment, query,{id: 4},).subscribe({ |
| 120 | + start: () => {}, |
| 121 | + complete: () => {}, |
| 122 | + error: (error) => {}, |
| 123 | + next: (data) => { // $ Missing: Source |
| 124 | + const outputElement = document.getElementById('output'); |
| 125 | + if (outputElement) { |
| 126 | + outputElement.innerHTML = data.user; // $ Missing: Alert |
| 127 | + } |
| 128 | + } |
| 129 | + }); |
| 130 | +} |
| 131 | + |
| 132 | +import { readFragment } from "relay-runtime"; |
| 133 | + |
| 134 | +function func10({ query, key }) { |
| 135 | + const data = readFragment(query, key); // $ Missing: Source |
| 136 | + return (<h1 dangerouslySetInnerHTML={{ __html: data }} />); // $ Missing: Alert |
| 137 | +} |
0 commit comments