matrix/authentication-service
1
0
Fork 0
mirror of https://github.com/matrix-org/matrix-authentication-service.git synced 2025-11-21 23:00:50 +03:00
Code Activity

frontend: Migrate to jotai and urql

Browse Source 
This cuts the bundle size by 50% and makes it easier to reason about state.
It removes the usage of react-router-dom and replaces it with a simple router atom based on jotai-location.
Since the screens will be quite simple, I don't expect that we'll need the advanced caching features of react-relay, hence the switch to urql.
This commit is contained in:
Quentin Gliech
2023-03-20 18:08:58 +01:00
parent 17e4bb70c1
commit b26d12f52f
40 changed files with 3008 additions and 3112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
frontend/src/components/OAuth2Session.tsx
View File

@@ -12,38 +12,36 @@
// See the License for the specific language governing permissions and
// limitations under the License.
import type { OAuth2Session_session$key } from "./__generated__/OAuth2Session_session.graphql";
import { graphql, useFragment } from "react-relay";
import { Body, Bold, Code } from "./Typography";
import Block from "./Block";
import { Link } from "react-router-dom";
import { Link } from "../Router";
import { FragmentType, graphql, useFragment } from "../gql";
const FRAGMENT = graphql(/* GraphQL */ `
fragment OAuth2Session_session on Oauth2Session {
id
scope
client {
id
clientId
clientName
clientUri
}
}
`);
type Props = {
session: OAuth2Session_session$key;
session: FragmentType<typeof FRAGMENT>;
};
const OAuth2Session: React.FC<Props> = ({ session }) => {
const data = useFragment(
graphql`
fragment OAuth2Session_session on Oauth2Session {
id
scope
client {
id
clientId
clientName
clientUri
}
}
`,
session
);
const data = useFragment(FRAGMENT, session);
return (
<Block>
<Body>
<Link
to={`/client/${data.client.id}`}
route={{ type: "client", id: data.client.id }}
className="text-links hover:text-links/75"
>
Client ID: <Code>{data.client.clientId}</Code>