···162162 </button>
163163 </div>
164164 {error && <div className="error">{error}</div>}
165165+ <AuthWarning />
165166 </form>
167167+ );
168168+}
169169+170170+function AuthWarning() {
171171+ const [expanded, setExpanded] = useState(false);
172172+173173+ return (
174174+ <div className="auth-warning">
175175+ atvouch.dev needs to request all permissions due to{" "}
176176+ <a href="https://github.com/bluesky-social/atproto/issues/4479" target="_blank" rel="noopener noreferrer">an issue</a>{" "}
177177+ in the Bluesky Reference PDS{" "}
178178+ <a
179179+ href="#"
180180+ onClick={(e) => {
181181+ e.preventDefault();
182182+ setExpanded(!expanded);
183183+ }}
184184+ >
185185+ [{expanded ? "show less" : "show more"}]
186186+ </a>
187187+ {expanded && (
188188+ <p className="auth-warning-details">
189189+ my intent is to use only the XRPCs for the api.atvouch.dev service and never interact with
190190+ the bsky lexicons, but <code>rpc?lxm=*&aud=did:web:api.atvouch.dev%23atvouch_appview</code> does not
191191+ work due to the aforementioned issue.
192192+ <br /><br />
193193+ I hope this can be fixed someday. help me bsky pbc, you're my only hope
194194+ </p>
195195+ )}
196196+ </div>
166197 );
167198}
168199