Skip to content

✨ Add all github languages #267

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 1 commit into
base: master
Choose a base branch
from
Draft

✨ Add all github languages #267

wants to merge 1 commit into from

Conversation

ashawe
Copy link

@ashawe ashawe commented Mar 7, 2020

FIX #10
I've added all the github languages on this page

But as your todo suggests, it would be better if we implement autocomplete combo box.
I tried a lot ( I have no experience in TypeScript and react ) but I couldn't figure out what the errors were.

Steps I took:

  1. Upgrade material core and include ``material lab``` for autocomplete
  2. Since we upgraded material core we need to change the syntax of StyleRulesCallback something like this:
import {
  StyleRulesCallback,
  Theme
} from "@material-ui/core/styles";
  .
  .
  .

const styles: StyleRulesCallback<Theme,Props> = _ => ({
  .
  .
  .
});
  1. Make a function return all the languages in a group as github shows
export function Grouped() {
  function handleInputChange(event,value){
    console.log(event); // required as we need value and it will throw error that event is not read
    window.location.href = `/?language=${value.value}`;
  }

  return (
    <Autocomplete
      id="language"
      options={languageOptions}
      groupBy={option => option.type}
      getOptionLabel={option => option.name}
      style={{ width: 300 }}
      onChange={handleInputChange}
      renderInput={params => <TextField {...params} label="Select Language" variant="outlined" />}
    />
  );
}
  1. Instead of <FormGroup> use {this.Grouped()}

this is supposed to be it but I faced a lot of problems.

Problems I faced:

  1. dependency issue of material lab and material core
  2. implementing inputProps property in Autocomplete as in MenuItem
  3. changing syntax of StylesRulesCallback
  4. setting value of Autocomplete to language passed
  5. This error that I couldn't figure out
  Overload 1 of 2, '(props: Pick<PropsWithChildren<Props>, "language" | "children" | "fetchedRepositoryCount" | "totalRepositoryCount"> & StyledComponentProps<string> & Props, context?: any): ReactElement<...> | Component<...>', gave the following error.
16:23:26.613
    Property 'classes' is missing in type '{ language: string; fetchedRepositoryCount: number; totalRepositoryCount: number; }' but required in type 'Props'.
16:23:26.613
  Overload 2 of 2, '(props: PropsWithChildren<Pick<PropsWithChildren<Props>, "language" | "children" | "fetchedRepositoryCount" | "totalRepositoryCount"> & StyledComponentProps<string> & Props>, context?: any): ReactElement<...> | Component<...>', gave the following error.
16:23:26.613
    Property 'classes' is missing in type '{ language: string; fetchedRepositoryCount: number; totalRepositoryCount: number; }' but required in type 'Props'.
16:23:26.613
    81 |   return (
16:23:26.613
    82 |     <Paper elevation={1} className={classes.paper}>
16:23:26.613
  > 83 |       <Header
16:23:26.613
       |        ^
16:23:26.613
    84 |         language={language}
16:23:26.613
    85 |         fetchedRepositoryCount={repositories.length}
16:23:26.613
    86 |         totalRepositoryCount={repositoryCount}

@vercel
Copy link

vercel bot commented Mar 7, 2020

This pull request is being automatically deployed with ZEIT Now (learn more).
To see the status of your deployment, click on the icon next to each commit.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Enable to select all languages that GitHub recognize
1 participant