cfpb / ccdb5-ui Goto Github PK

Modify the linting process to use the front-end linting file. Adjustments might need to be made for React and JSX.

This application needs JS to run, so it would be nice to have some messaging indicating that. Owning a home displays a notification, so it might make sense to use that.

Owning a home notification:

Short description explaining the high-level reason for the new issue.

Current behavior

Expected behavior

Steps to replicate behavior (include URLs)

1. I will be interesting to no everything behind ccdb-ui
   2.Ok Let deal with Current behavior expected behavior
   3 What goes in between

Screenshots

When searching complaint id, id is returning with the <em> tag instead of actually highlighting

Current behavior

Expected behavior

Should be highlighted instead

Steps to replicate behavior (include URLs)

1. Go to the base URL, then type in a complaint id, i.e. 1996671 with All Data selected.

Short description explaining the high-level reason for the new issue.

Current behavior

A better understanding line 2

Expected behavior

Open the repository line 2

Steps to replicate behavior (include URLs)

1. What is my reply line 1

Screenshots

#213

It may be a little late, but Autoprefixer may have been able to take care of IE9 specific hacks for flexbox

A new search input component was added to the DS in cfpb/design-system#1979, which removes the m-btn-inside-input, which is found in the Typeahead in this repo. The search input in this project should migrate to the new o-search-input component.

::-ms-clear {
display: none;
}

Short description explaining the high-level reason for the new issue.

Current behavior

Expected behavior

Steps to replicate behavior (include URLs)

Screenshots

This was raised during the PR for #40

Current behavior

The UI uses the styles designed by @kurzn

Expected behavior

@sebworks requested the component use the existing styles from the cfgov site

This issue was brought up in the PR for #40

Current behavior

If the API call fails on the main (index) page, nothing appears.

Expected behavior

A warning should alert the user that the API call failed

Steps to replicate behavior (include URLs)

1. Turn off the Server
2. Refresh the UI

Screenshots

I would consider upgrading the NPM dependencies, especially Webpack, to the latest versions . There are some great features in Webpack 2.x and 3.x. https://webpack.github.io/docs/roadmap.html.

There is a problem where package-lock.json is not part of the commit

When using on my iPad 2, I noticed that large aggregation title blocks get misaligned

Current behavior

The text wraps to a line below the checkbox

Expected behavior

There is always text on the line with the checkbox

Steps to replicate behavior (include URLs)

1. Go to the "Issue/Subissue" aggregation
2. Click on "Show xxx more"
3. Some titles are misaligned

Screenshots

The README should be updated.

For starters:

• We should add a link to where this app lives on consumerfinance.gov
• Update the screenshot. It looks like it's from 2015.
• Update Dependencies section. We're on Design System now. I don't think we need to list all of the individual pieces.
• We're moving off of react-typeahead and going to use React bootstrap typeahead
• Update information about unit testing

Error notifications in the app lack margin

The Show X more... logic is incomplete

Short description explaining the high-level reason for the new issue.

Current behavior

Expected behavior

Steps to replicate behavior (include URLs)

1.To if this issues is done correctly

Screenshots

Short description explaining the high-level reason for the new issue.

Current behavior

• Thinking is this a distraction of my main objective

Expected behavior

• Time to leave cores-ponder alone, I see you ever where

Steps to replicate behavior (include URLs)

1+ llovy4545@o

Screenshots

The code here assumes that the Django request object always have a META['HTTP_USER_AGENT'] value, which cannot be assumed. This value gets created from the HTTP request's User-Agent header (see Django docs), which may not always exist.

A simple fix here might be to change the code from request.META['HTTP_USER_AGENT'] to request.META.get('HTTP_USER_AGENT'), and handle the case where the value doesn't exist.

Current behavior

Requests with a search query but no user agent cause a 500 error.

Expected behavior

Requests with a search query but no user agent are handled properly.

Steps to replicate behavior (include URLs)

1. Try this curl command, which omits the User-Agent header:

curl -v -H "User-Agent:" https://www.consumerfinance.gov/data-research/consumer-complaints/search/?searchField=company

This raises a 500 error.

Type-ahead previews are currently showing strange text when advanced search wildcards are used. Likely an issue with normalizing to .toLowercase() and special characters not getting same treatment from indexOf().

Current behavior

Selections work just fine, happily. It's just the selector that removes the trailing characters.

Expected behavior

Entering text rate* yields rate change instead of e change in preview.

Steps to replicate behavior (include URLs)

1. Navigate to environment.
2. Enter rate* as search criteria
3. See type-ahead selector component

Using the TAB key only to navigate CCDB traps you in the search box, with no way to move on to other UI elements without using a mouse.

Also being tracked internally at GHE/CFGOV/platform/issues/2829. Tagging @sephcoster and @JeffreyMFarley.

Current behavior

If using the keyboard only to navigate, you can't move past the search box on CCDB to apply filters.

Expected behavior

If using the keyboard only to navigate, you can move past the search box on CCDB to apply filters or move up and down the page.

The templates for this app are located in the root ccdb5_ui/templates level and thus referred to with no subdirectories when rendering, e.g. template_name = 'standalone-base.html'.

This works as long as all template names are guaranteed to be unique across all apps in a Django project, but could cause conflicts if, say, another app also has a standalone_base.html in its root templates directory. Prefixing all template names with ccdb- might work but has to be done consistently.

The Django convention seems to be to place templates under subdirectories named for the app, e.g. ccdb5-ui/templates/ccdb5-ui/main.html. At first this might feel duplicative but it makes the view code clearer, especially if these templates are ever referred to from another project, e.g. 'template_name = 'ccdb5-ui/main.hml.

From the Django tutorial:

Now we might be able to get away with putting our templates directly in polls/templates (rather than creating another polls subdirectory), but it would actually be a bad idea. Django will choose the first template it finds whose name matches, and if you had a template with the same name in a different application, Django would be unable to distinguish between them. We need to be able to point Django at the right one, and the easiest way to ensure this is by namespacing them. That is, by putting those templates inside another directory named for the application itself.

Current behavior

Templates for this app live under ccdb5-ui/templates.

Expected behavior

Templates for this app live under ccdb5-ui/templates/ccdb5-ui.

This issue was raised as part of PR #40.

Current behavior

In some constructors, there is a block of code that looks like this:

    this._handleSubmit = this._handleSubmit.bind(this);
    this._updateInputValue = this._updateInputValue.bind(this);

This is necessary so that this is available in callbacks.
https://facebook.github.io/react/docs/handling-events.html

Expected behavior

@sebworks suggested using a bindAll utility function to simplify/ease this code block.

https://stackoverflow.com/questions/32192682/react-js-es6-avoid-binding-this-to-every-method
https://www.npmjs.com/package/lodash.bindall

This repo is blocked from updating cfpb-expandables because a number of significant updates have happened since version 0.17.12 pinned in this repo. Reference the DS CHANGELOG for updates, which include:

• Removing show/hide text labels and setting cue role to role="img".
• Changing o-expandable_link to o-expandable_cues.
• Removing o-expandable_target, o-expandable_header-left, and o-expandable_header-right classes.
• Moving o-expandable__onload-open class to container o-expandable class.
• Moving expandable JavaScript to FlyoutMenu instead of AtomicComponent.

That last one may not be applicable to this repo, since it uses a customized React-based expandable component (https://github.com/cfpb/ccdb5-ui/blob/main/src/components/Filters/CollapsibleFilter.js), but the CSS would need to be migrated in order for it to maintain its styling.

It may make sense to follow https://github.com/cfpb/design-stories/ for development of a React version of expandables.