Remover turf.min.js do código fonte, instalando por npm ou usando um CDN.

• Mostrar mensagem de erro para buscas de endereços fora de SP, Capital
• Limitar buscas pela API do Google
• Validar o input do usuário por bounding box da cidade de SP, após retorno do endereço georeferenciado

Atualmente o app retorna uma mensagem que não faz sentido. Escrever uma mensagem de erro apropriada para esses casos.

Relacionado a #7

Deve funcionar com nosso deploy no Github Pages.

Possíveis ferramentas (não testadas):

• https://github.com/pushtell/react-ab-test
• https://github.com/envato/react-ab-experiment

Alguma mudança quebrou a rota /cadastrar.

Erro:

new SchoolList
src/components/SchoolList.js:13
  10 | constructor(props) {
  11 |   super(props);
  12 |   this.state = {
> 13 |     displayedListSize: props.shortenList
  14 |       ? Math.min(shortenedListSize, props.schools.length)
  15 |       : props.schools.length,
  16 |   };

@victorsenam precisamos achar o que quebrou isso. Vou começar a investigar agora. Está quebrado em produção inclusive.

Atualmente a aplicação não ocupa todo o espaço da tela, funciona muito bem em celular mas o efeito não é muito agradável em computadores.

Eu sugiro algumas mudanças na UI especificamente da página de resultados. Aqui vai um screenshot de como ela está agora.

• Primeiro, eu acho que o título contém informação demais. A pessoa já sabe que está buscando para um tal endereço e tal grupo e essa informação fica numa fonte grande logo no começo da página quando ela é provavelmente ignorada. Acredito que isso canse o usuário e deixa a experiência mais confusa, leva ao usuário ao hábito de ignorar texto importante no resto da aplicação. Sugiro que a gente mude para algo mais ou menos assim:
  
  Isso deixa todas as informações anteriores ali e mantém a mesma explicação sobre a fila que existia antes, mas prioriza e cansa menos.
• A data da atualização de dados que está no fim da página pode ficar no banner mesmo, no texto pequeno, na minha opinião. Isto é, em vez de colocar "* Dados atualizados em 30/08/2018 04:06" no fim da listagem das creches, colocar "Há 65 crianças na fila do Mini Grupo I a serem distribuídas nas 11 creches perto de R. do Matão - Butantã, São Paulo - SP, 03178-200, Brasil. Estes dados foram atualizados em 30/08/2018 04:06." logo no cabeçalho. Mantém todas as informações em um lugar só e limpa uma linha de informação "secundária" da listagem.
• Não entendo o porque do subtítulo "CRECHE" antes da listagem. Poderíamos tirá-lo.
• Na página de cadastro, adicionamos mudamos as informações disponibilizadas sobre as creches. Acho que isso é confuso para o usuário e, se ele tem interesse em recuperar a informação que viu em uma destas páginas, por elas serem tão parecidas, vai tentar fazer em qualquer uma e falhar, o que gera frustração. Acho que deveríamos deixar isso consistente entre as duas páginas e, preferencialmente, usar o mesmo componente no react. Pelo código, me parece que se a escola tem um número de telefone, ele é mostrado só na página de registro e não na página de resultados. O mesmo acontece com o tipo de escola.
  

Atualmente, se você abrir um link direto para a rota do cadastro, aparece uma tela em branco: http://filadacreche.sme.prefeitura.sp.gov.br/#/cadastrar/27

Isso é porque o estado dessa rota vem da rota anterior. Precisamos lidar com isso para permitir um permalink aqui, ou pelo menos redirecionar para outra tela anterior.

Código duplicado dificulta a manutenção e a eficiência do código.

Os códigos duplicados segundo análise do Code Climate estão no link abaixo:

https://codeclimate.com/github/prefeiturasp/SME-FilaDaCreche/issues?category=duplication&engine_name%5B%5D=structure&engine_name%5B%5D=duplication

Centro de Educação Infantil, ou CEI, é o termo tecnicamente mais correto. Decidimos utilizar "creche" devido ao seu maior uso fora da SME.

Podemos adicionar em algum lugar da interface uma observação sobre essa decisão.

Teste Unitário dos componentes.

Poderia incluir número de turmas, infraestrutura da unidade, etc.

Vai requerer modelar esses dados na API também.

Com Google Forms para comentários

Algumas sugestões feitas na issue #27 foram aceitas e podem ser implementadas. São elas:

• Alterar o título para que ele contenha menos informações (primeiro item das sugestões)
• Mudar a localização da data de atualização das informações (segundo item)
• Remover o cabeçalho "CRECHES" (terceiro item)

Projeto está dando erro devido aos imports

Métodos bem escritos usualmente tem apenas uma função e não várias, métodos com muitas linhas costumam estar realizando mais de uma tarefa, o que pode dificultar a manutenção futura.

Os métodos que se encontram nesse situação devem ser refatorados, segue o link da análise do code climate.

https://codeclimate.com/github/prefeiturasp/SME-FilaDaCreche/issues?category=complexity&engine_name%5B%5D=structure&engine_name%5B%5D=duplication

Testes e2e para a aplicação.

Carregar JS async para não bloquear o carregamento da página e aumentar velocidade.

Prever casos de link direto para página dos resultados, que requer os dois JS carregados hoje (Google Maps API e turf.js) para funcionar.

Os componentes que estão na pasta "components" são do tipo stateful (com estado) e a maioria não gerencia um estado interno (local state) e não faz uso dos métodos de ciclo de vida do componente. Dessa forma, é interessante fazer uma refatoração para transformá-los de "stateful" para "stateless".

Apesar dessa mudança não impactar a perfomance da aplicação, componentes sem estado são mais fáceis de serem entendidos (já que são apenas funções que recebem uma entrada e retornam uma saída) e testados. O ideal é sempre iniciar com um componente sem estado e quando surgir a necessidade refatorar para um componente com estado.

Abaixo segue a lista dos arquivos que podem passar por essa mudança:

• Alert.js
• BackButton.js
• Banner.js
• CollapseButton.js
• ContinueButton.js
• DefaultButton.js
• Footer.js
• HomeBanner.js
• Logo.js
• Spacer.js
• SubBanner.js

Para quem for contribuir nessa issue:

• faça para cada arquivo um PullRequest (PR) separado pois assim fica mais fácil para testar e analisar os impactos da mudança
• referencie essa issue para saber quais arquivos já foram alterados

Essa refatoração é simples e ideal para quem está começando com React.

Atualmente, ao se abrir um link não existente uma página branca é mostrada.

Com https://letsencrypt.org/

O problema, como apresentado na issue #27 é

Na página de cadastro, adicionamos mudamos as informações disponibilizadas sobre as creches. Acho que isso é confuso para o usuário e, se ele tem interesse em recuperar a informação que viu em uma destas páginas, por elas serem tão parecidas, vai tentar fazer em qualquer uma e falhar, o que gera frustração. Acho que deveríamos deixar isso consistente entre as duas páginas e, preferencialmente, usar o mesmo componente no react. Pelo código, me parece que se a escola tem um número de telefone, ele é mostrado só na página de registro e não na página de resultados. O mesmo acontece com o tipo de escola.

Este é um screenshot da página de registro

Este é um da página de resultados apresentando a mesma creche

Segundo este comentário do @bplmp, existem mais diferenças. A página de registro apresenta as instituições nas quais pode ser realizado o cadastro, por isso, mostra, além de creches, outras instituições de ensino que não necessariamente oferecem ensino infantil. Daí a utilidade de mostrar o tipo de escola. Na página de resultados é apresentada a quantidade de crianças matriculadas em cada uma, informação irrelevante na hora escolher onde fazer o cadastro já que o lugar onde é realizado o cadastro não é necessariamente o lugar para o qual se faz o cadastro.

Foi decidido que esta discussão era complexa e que valia à pena dividir a issue original em duas, permitindo tratar os problemas independentemente e agilizar a solução das outras.

Quando eu rodo npm run localmente eu recebo vários lint warnings. Acho muito interessante evitar isso e suprimir os warnings inúteis com // eslint-disable-next-line. Evitar que existam linter warnings evita que nós criemos novos warnings e faz com que a qualidade do código se mantenha boa constantemente.

Compiled with warnings.

./src/containers/Results/Results.js
  Line 1:   'Component' is defined but never used  no-unused-vars
  Line 2:   'Router' is defined but never used     no-unused-vars
  Line 2:   'Route' is defined but never used      no-unused-vars
  Line 8:   'Spacer' is defined but never used     no-unused-vars
  Line 16:  Expected '===' and instead saw '=='    eqeqeq

./src/containers/Register/Register.js
  Line 1:  'Component' is defined but never used  no-unused-vars

./src/containers/CheckIfRegistered/CheckIfRegistered.js
  Line 1:  'Component' is defined but never used  no-unused-vars

./src/containers/IsRegistered/IsRegistered.js
  Line 1:  'Component' is defined but never used  no-unused-vars

./src/containers/DateOfBirthForm/DateOfBirthForm.js
  Line 1:  'Component' is defined but never used  no-unused-vars

./src/containers/AddressInput/AddressInput.js
  Line 1:  'Component' is defined but never used  no-unused-vars

./src/containers/Home/Home.js
  Line 1:  'Component' is defined but never used  no-unused-vars
  Line 5:  'Logo' is defined but never used       no-unused-vars

./src/containers/PreschoolGroup/PreschoolGroup.js
  Line 2:   'Router' is defined but never used  no-unused-vars
  Line 2:   'Route' is defined but never used   no-unused-vars
  Line 13:  Missing radix parameter             radix
  Line 14:  Missing radix parameter             radix

./src/App.js
  Line 2:   'Router' is defined but never used   no-unused-vars
  Line 2:   'Link' is defined but never used     no-unused-vars
  Line 18:  'GLOBALS' is defined but never used  no-unused-vars
  Line 19:  'API' is defined but never used      no-unused-vars

./src/containers/DateOfBirthForm/SelectDate.js
  Line 2:   'Router' is defined but never used                 no-unused-vars
  Line 2:   'Route' is defined but never used                  no-unused-vars
  Line 6:   'GLOBALS' is defined but never used                no-unused-vars
  Line 49:  Missing radix parameter                            radix
  Line 50:  Missing radix parameter                            radix
  Line 68:  'dateSelected' is assigned a value but never used  no-unused-vars

./src/components/ContinueButton.js
  Line 2:  'Router' is defined but never used  no-unused-vars
  Line 2:  'Route' is defined but never used   no-unused-vars

./src/components/Logo.js
  Line 3:  'logo' is defined but never used  no-unused-vars

./src/containers/AddressInput/AddressForm.js
  Line 4:  'Router' is defined but never used  no-unused-vars
  Line 4:  'Route' is defined but never used   no-unused-vars

./src/components/Footer.js
  Line 6:  'footerMob' is defined but never used   no-unused-vars
  Line 7:  'footerDesk' is defined but never used  no-unused-vars

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

Possivelmente em um mapa de calor.

Vai requerer modelar os dados na API.

Esse projeto ainda é mantido? Vejo que há PR e ISSUES paradas. Gostaria de saber, para pode contribuir.

As creches (CEIs) tem tipos, que são atualmente exibidos como "CR.P.CONV", "CEI INDIR', etc.

Devemos criar um dicionário com esses valores para exibição de algo mais amigável na aplicação, ou incorporar aos dados já um tipo da escola que seja mais amigável, nesse caso direto em https://github.com/prefeiturasp/SME-fila-da-creche-API.