<commit_before>import { Paper } from "material-ui";
import { observer } from "mobx-react";
import * as React from "react";
import { Helmet } from "react-helmet";
import {
  RouteComponentProps,
  withRouter,
} from "react-router-dom";
import { Page, Res, Snack } from "../components";
import { myInject, UserStore } from "../stores";
import {
  withModal,
} from "../utils";
import { findReses } from "../gql/res.gql";
import { findReses as findResesResult, findResesVariables } from "../gql/_gql/findReses";
import { Query } from "react-apollo";

interface ResBaseProps extends RouteComponentProps<{ id: string }> {
  user: UserStore;
  zDepth?: number;
}

interface ResBaseState {
}

const ResBase = withRouter(myInject(["user"],
  observer(class extends React.Component<ResBaseProps, ResBaseState> {
    constructor(props: ResBaseProps) {
      super(props);
    }

    render() {
      return <div>
        <Helmet>
          <title>レス</title>
        </Helmet>
        <Query<findResesResult, findResesVariables>
          query={findReses}
          variables={{ query: { id: [this.props.match.params.id] } }}>
          {({ loading, error, data }) => {
            if (loading) return "Loading...";
            if (error || !data || data.reses.length === 0) return (<Snack msg="レス取得に失敗しました" />);

            return (
              <Paper zDepth={this.props.zDepth}>
                <Res res={data.reses[0]} />
              </Paper>
            );
          }}
        </Query>
      </div>;
    }
  })));

export function ResPage() {
  return <Page><ResBase /></Page>;
}

export const ResModal = withModal(() => <ResBase zDepth={0} />, "レス詳細");
<commit_msg>ResPage<commit_after>import { Paper } from "material-ui";
import * as React from "react";
import { Helmet } from "react-helmet";
import {
  RouteComponentProps,
  withRouter,
} from "react-router-dom";
import { Page, Res, Snack } from "../components";
import {
  withModal,
} from "../utils";
import * as G from "../../generated/graphql";

interface ResBaseProps extends RouteComponentProps<{ id: string }> {
  zDepth?: number;
}

interface ResBaseState {
}

const ResBase = withRouter((class extends React.Component<ResBaseProps, ResBaseState> {
  constructor(props: ResBaseProps) {
    super(props);
  }

  render() {
    return <div>
      <Helmet>
        <title>レス</title>
      </Helmet>
      <G.FindReses.Component
        variables={{ query: { id: [this.props.match.params.id] } }}>
        {({ loading, error, data }) => {
          if (loading) return "Loading...";
          if (error || !data || data.reses.length === 0) return (<Snack msg="レス取得に失敗しました" />);

          return (
            <Paper zDepth={this.props.zDepth}>
              <Res res={data.reses[0]} />
            </Paper>
          );
        }}
      </G.FindReses.Component>
    </div>;
  }
}));

export function ResPage() {
  return <Page><ResBase /></Page>;
}

export const ResModal = withModal(() => <ResBase zDepth={0} />, "レス詳細");

{'fraction_non_alphanumeric': 0.16621983914209115, 'fraction_numerical': 0.0020107238605898124, 'mean_word_length': 2.667076167076167, 'pattern_counts': {'":': 0, '<': 40, '<?xml version=': 0, '>': 44, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2710846', 'n_tokens_mistral': 968, 'n_tokens_neox': 957, 'n_words': 222}