Commit Graph

295 Commits

Author SHA1 Message Date
Javi Martín
6f81215425 Merge pull request #5786 from consuldemocracy/stats_turbolinks_reload
Include stat graphs JavaScript in all admin stats actions
2024-11-11 15:46:15 +01:00
Javi Martín
4102330abc Add labels to investments filters
Note that adding the labels broke the layout because the button was no
longer aligned with the fields, so we're now using a flex layout.

Since we're using labels, we no longer need a placeholder (which wasn't
very informative, by the way) in the text field.
2024-11-11 15:04:40 +01:00
Javi Martín
670f4515ab Remove obsolete HTML class in advanced filters button
The `clear` class isn't needed since commit c9f31b8e1, when we moved
this button above the regular search fields.

We're also moving the `float` property to the CSS file.
2024-11-11 15:04:40 +01:00
Javi Martín
29968d1d9f Use a button to toggle advanced filters
As mentioned in commit 5311daadf, there are several reasons to use
buttons in these situations.
2024-11-11 15:04:40 +01:00
Javi Martín
bc4fd63950 Simplify advanced filter params initialization 2024-11-11 15:04:40 +01:00
Javi Martín
c28ff49f10 Move investments search form partial to a component
As a bonus, we now have a few less helper methods :).
2024-11-11 15:04:40 +01:00
Javi Martín
02825c22fe Include stat graphs JavaScript in all admin stats actions
Since the main stats index loads this JavaScript using
`"data-turbolinks-track" => "reload"`, going from the stats index to a
section that doesn't include this JavaScript did the strange effect
Turbolinks does in these situations: it first loaded the page using an
AJAX request and, after getting the contents of the page, it reloaded it
in order to apply the changes in the included JavaScript.

This behavior was a bit confusing, particularly when browsing to a
section of the admin stats, clicking the browser's back button to go
back to the stats index, the going to another section, ...

One of the admin stats tests was failing sometimes with this message:

```
  1) Stats Budget investments Supporting phase Number of users and
     supports in investment projects
     Failure/Error: raise ex, cause: cause

     Selenium::WebDriver::Error::UnknownError:
       unknown error: unhandled inspector error:
         {"code":-32000,"message":"Node with given id does not belong to the document"}
         (Session info: chrome=129.0.6668.89)
```

This was probably caused by the mentioned Turbolinks behavior that loads
the page twice. It's possible that Selenium was somehow checking the
node related to the first request when the second request had finished.

Avoiding that double request solves the issue.
2024-11-08 19:54:29 +01:00
Javi Martín
9a4aea9381 Extract method to include stat graphs JavaScript
We're going to use this method everywhere in the admin stats section.
2024-11-08 19:37:09 +01:00
Javi Martín
8213f23629 Use I18n texts for image dimensions
This way it'll be possible to customize the text in languages not using
parenthesis or not using an "x" to define dimensions.
2024-11-08 15:03:55 +01:00
Javi Martín
b82d7032ba Add a hint to the site customization image fields
This way people using screen readers will hear the required dimensions
of the images while filling in the form.
2024-11-08 15:03:55 +01:00
Javi Martín
5ca65a787f Add an ARIA label to site customization images fields
This way it'll be easier for people using screen readers to know which
field they're on.
2024-11-08 15:03:55 +01:00
Javi Martín
331228cb2a Add proper labels for site customization texts
We were rendering one label and many textarea fields for that label.
This meant that, when switching to a different language, the label
wasn't correctly associated with the textarea.

So we're now rendering one label for each textarea. We could use
`aria-label` or `aria-labelledby` instead, but using a label offers some
advantages like the fact that clicking on the label makes the textarea
take the focus.
2024-11-08 15:03:55 +01:00
Javi Martín
0f712635a4 Extract method in information text field component
This will make it easier to reuse this method.
2024-11-08 15:03:55 +01:00
Javi Martín
e1353fd865 Fix duplicate fields in information texts form
We were rendering the same hidden field, with the same HTML ID, one time
per enabled locale.
2024-11-08 15:03:55 +01:00
Javi Martín
9f738b8d5f Fix labels in progress bar percentage selection
We were using the same label for two elements, but the label was only
assigned to one of them.
2024-11-08 15:03:55 +01:00
Javi Martín
233ba3c72f Move progress bars form partial to a component
This way we can move some of the view logic to the Ruby class. It'll
also make it easier to write tests for it.
2024-11-08 15:03:55 +01:00
Javi Martín
9c057d5695 Fix labels in color selection
We were using the same label for two elements, but the label was only
assigned to one of them.
2024-11-08 15:03:55 +01:00
Javi Martín
8aff1414c5 Move legislation process form partial to a component
This will make it easier to write tests for it.
2024-11-08 15:03:55 +01:00
Javi Martín
e850ae2ff9 Move banner form partial to a component
Other than simplifying the controller, this'll make it easier to write
tests for this code.
2024-11-08 14:24:57 +01:00
taitus
a5911f5c6a Modify admin layout to only manage tenants and admins
We only want to render the account link and login items in the header.
And we want only render the Multitenancy and Administrators sections in
the admin sidebar.

We include the administrators management so it's possible to give
permissions to other users to manage tenants.

In order to restrict access to other sections by typing the URL or
following a link, we're only enabling the rest of the routes when we
aren't in the multitenancy management mode.
2024-11-06 11:17:53 +01:00
Javi Martín
fc5103881d Use a switch to toggle visibility to valuators
Using a checkbox wasn't very intuitive because checkboxes are
checked/unchecked when clicked on even if there's an error in the
request. Usually, when checkboxes appear on a form, they don't send any
information to the server unless we click a button to send the form.

So we're using a switch instead of a checkbox, like we did to
enable/disable phases in commit 46d8bc4f0.

Note that, since we've got two switches that match the default
`dom_id(record) .toggle-switch` selector, we need to find a way to
differentiate them. We're adding the `form_class` option for that.

Also note that we're now using a separate action and removing the
JavaScript in the `update` action which assumed that AJAX requests to
this action were always related to updating the `visible_to_valuators`
attribute.
2024-10-28 13:41:55 +01:00
Javi Martín
00d7299e9e Extract component for visible to valuators toggling 2024-10-28 13:41:55 +01:00
Javi Martín
958c13061f Fix duplicate HTML visible to valuator IDs 2024-10-28 13:41:55 +01:00
Javi Martín
54a48d63e1 Use separate actions to select/deselect investments
This is consistent to what we usually do. Also, we're applying the same
criteria mentioned in commit 72704d776:

> We're also making these actions idempotent, so sending many requests
> to the same action will get the same result, which wasn't the case
> with the `toggle` action. Although it's a low probability case, the
> `toggle` action could result in [selecting an investment] when trying
> to [deselect] it if someone else has [deselected it] it between the
> time the page loaded and the time the admin clicked on the
> "[Selected]" button.
2024-10-28 13:41:50 +01:00
Javi Martín
463112c2ea Use a switch to toggle investment selection
Just like it happened with proposals, the button to select/deselect an
investment wasn't very intuitive; for example, it wasn't obvious that
pressing a button saying "selected" would deselect the investment.

So we're using a switch control, like we do to enable/disable features
since commit fabe97e50.

Note that we're making the text of the switch smaller than in other
places because the text in the investments table it is also smaller
(we're using `font-size: inherit` for that purpose). That made the
button look weird because we were using rems instead of ems for the
width of the button, so we're adjusting that as well.

Also note we're changing the width of the switch to `6em` instead of
`6.25em` (which would be 100px if 1em is 16px). We're doing so because
we used 100 for the minimum width because it's a round number, so
now we're using another round number.
2024-10-28 13:40:27 +01:00
Javi Martín
9e5566cee4 Use a button to toggle investment selection
As mentioned in commit 5311daadf, using buttons for non-GET requests has
several advantages over using links.
2024-10-28 13:39:49 +01:00
Javi Martín
cf0d8258ed Use abilities to allow toggling investment selection
We were checking it in the view, meaning that it was possible to toggle
the selection by sending a custom request even when the investment
wasn't feasible.
2024-10-28 13:39:49 +01:00
Javi Martín
95f36ed52f Simplify code to toggle investment selection
This way it'll be easier to change the link/button used to toggle the
selection.

Note that the conditions in the view seem to be different because we no
longer include the `selected?` condition when rendering the link/button.
However, an investment can only be selected if it's feasible and its
valuation is finished, so writing something like this would have been
redundant:

```ruby
can?(:toggle_selection, investment) &&
  (selected? || investment.feasible? && investment.valuation_finished?)
```

The reason why the previous code was using the `selected?` condition was
to check whether to render the link/button to select or to deselect an
investment. We're now doing that in the Ruby part of the component.
2024-10-28 13:39:42 +01:00
Javi Martín
c78494c100 Extract method to get toggle selection path
This way we simplify the view code.

Since now we only use the `budget` method in one place, we're removing
it.
2024-10-28 13:37:56 +01:00
Javi Martín
fde24870bc Extract component for investment toggle selection
This way it'll be easier to refactor it.
2024-10-28 13:31:34 +01:00
Javi Martín
b9c3e75930 Fix duplicate HTML IDs in investments selection
Since this cell is shown once per row, there were multiple rows with the
same HTML ID on the page.
2024-10-25 17:24:32 +02:00
Javi Martín
73166e164b Simplify HTML for an investment row
Since we define the `data-field` element, we can style each element
individually with CSS.

I'm not sure whether these styles make sense, though. For instance, why
is "Supports" aligned to the center, since it's a number? For now, we're
leaving it as it was.
2024-10-25 17:24:32 +02:00
Javi Martín
607dabbc8a Move admin investments partial to a component
This way it'll be easier to organize the code related to it.
2024-10-25 17:24:32 +02:00
Javi Martín
9330cdb304 Extract methods in investment row component
This way we simplify the code a little bit.
2024-10-25 17:19:52 +02:00
Javi Martín
bb42809168 Move investment partial to a component
This way we'll be able to simplify it a little bit.

Note that the original partial didn't include the whole row and only
the cells. Since, most of the time, we include the whole row in
partials, we're slightly modifying the component.
2024-10-25 17:19:42 +02:00
Javi Martín
4a2fc50c76 Use separate actions to select/deselect proposals
This is consistent to what we usually do. Also, we're applying the same
criteria mentioned in commit 72704d776:

> We're also making these actions idempotent, so sending many requests
> to the same action will get the same result, which wasn't the case
> with the `toggle` action. Although it's a low probability case, the
> `toggle` action could result in [selecting a proposal] when trying to
> [deselect] it if someone else has [deselected it] it between the time
> the page loaded and the time the admin clicked on the "[Selected]"
> button.
2024-10-25 17:12:47 +02:00
Javi Martín
fec44c146c Use a switch to toggle proposal selection
The button to select/deselect a proposal wasn't very intuitive; for
example, it wasn't obvious that pressing a button saying "selected"
would deselect the proposal.

So we're using a switch control, like we do to enable/disable features
since commit fabe97e50.
2024-10-25 17:12:44 +02:00
Javi Martín
b127bd2f51 Use a button to toggle proposal selection
As mentioned in commit 5311daadf, using buttons for non-GET requests has
several advantages over using links.
2024-10-25 17:10:14 +02:00
Javi Martín
43b6ab00e3 Simplify method to get the toggle selection path 2024-10-25 16:40:34 +02:00
Javi Martín
3febe3f0cc Extract methods in toggle selection component 2024-10-25 16:40:34 +02:00
Javi Martín
3cebce9a29 Extract link to toggle selection to a component 2024-10-25 16:40:32 +02:00
Javi Martín
12e49ff607 Hide languages link when there's only one language
Most existing Consul Democracy installations will have changed their
`config.i18n.available_locales` option so only a few locales are
available. In many cases, only one locale will be available. In these
cases, rendering a form that only offers one option is useless.

We've considered adding a text in this case mentioning that, in order to
enable more languages, they need to configure their
`config.i18n.available_locales`. However, we haven't done it for two
reasons.

First, if they've changed the available locales to just one, there's a
good chance they aren't interested at all in configuring the locales.

And, second, if there's only one available locale, administrators will
learn to ignore the "languages" link, so they won't realize that locales
can be configured if developers change the available locales. If we hide
the link, on the other hand, they will notice that locales can now be
configured once developers change the available locales.

Note we're still allowing access by entering the URL. This is harmless,
though, since people accessing it this way will see a form with only one
possible option and won't be able to modify anything.
2024-06-25 18:58:57 +02:00
Javi Martín
8997ed316c Rename variables describing poll options as answers
Since we've renamed the class to `Option`, having variables, methods and
texts refering to it as `answer` was confusing.
2024-06-13 19:13:05 +02:00
Javi Martín
38b38d1fcc Rename Poll::Question::Answer to Poll::Question::Option
Having a class named `Poll::Question::Answer` and another class named
`Poll::Answer` was so confusing that no developer working on the project
has ever been capable of remembering which is which for more than a few
seconds.

Furthermore, we're planning to add open answers to polls, and we might
add a reference from the `poll_answers` table to the
`poll_question_answers` table to property differentiate between open
answers and closed answers. Having yet another thing named answer would
be more than what our brains can handle (we know it because we did this
once in a prototype).

So we're renaming `Poll::Question::Answer` to `Poll::Question::Option`.
Hopefully that'll make it easier to remember. The name is also (more or
less) consistent with the `Legislation::QuestionOption` class, which is
similar.

We aren't changing the table or columns names for now in order to avoid
possible issues when upgrading (old code running with the new database
tables/columns after running the migrations but before deployment has
finished, for instance). We might do it in the future.

I've tried not to change the internationalization keys either so
existing translations would still be valid. However, since we have to
change the keys in `activerecord.yml` so methods like
`human_attribute_name` keep working, I'm also changing them in places
where similar keys were used (like `poll_question_answer` or
`poll/question/answer`).

Note that it isn't clear whether we should use `option` or
`question_option` in some cases. In order to keep things simple, we're
using `option` where we were using `answer` and `question_option` where
we were using `question_answer`.

Also note we're adding tests for the admin menu component, since at
first I forgot to change the `answers` reference there and all tests
passed.
2024-06-13 19:13:01 +02:00
Javi Martín
6188281d33 Don't use instace variables in component views
Just like we do every else (sometimes even on that very same file), we
use the method instead of the instance variable.

We're doing this change now because we're about to modify one of these
files (the poll question answers documents index component).
2024-06-12 15:16:14 +02:00
Javi Martín
c367f21705 Add buttons to check all/none available languages
Although most Consul Democracy installations will only have a few
available languages using `config.i18n.available_locales`, there's a
chance some installation will keep every language as available and will
enable the desired ones using the admin interface. In these cases,
enabling (or disabling) every language would be tedious, particularly
when casually experimenting in a staging environment or while using the
official Consul Democracy demo.

So we're adding buttons to simplify the process. Since some
installations might have only a couple of available languages, and in
this case these buttons would be pretty much useless, we're only showing
them when there are many languages available.
2024-06-06 16:28:19 +02:00
Javi Martín
0c59c2dfb4 Extract model to handle locales settings
This way we can simplify the view, particularly the form. However, we're
still adding some complexity to the form so inputs are inside labels and
so the collection is easier to style with CSS.
2024-06-05 16:10:56 +02:00
Javi Martín
78bbf430d5 Add a form to edit available locales
We're using different controls depending on the number of available
locales.

When there are only a few locales, the solution is obvious: radio
buttons to select the default language, and checkboxes to select the
available ones are simple and intuitive.

With many languages, showing two consecutive lists of 30 languages could
be confusing, though, particularly on small devices, where scrolling
through both lists could be hard.

So, in this case, we're rendering a <select> to choose the default
language. For selecting the available languages, however, we're sticking
to checkboxes because all the other existing options (like multiple
selects) are hard to use. We think it's OK because the form doesn't have
any additional fields, and there's only one big list of options to
scroll through.

While testing the application, we noticed that if we use the
`admin-fieldset-separator` styles when there's only one fieldset, it's
harder to notice that there's an additional field to select the default
language. So we're only using the `admin-fieldset-separator` styles when
all the fields are grouped in fieldsets.

Regarding the help text for the fieldset, if we leave the help text
outside the <legend> tag, people using screen readers won't hear about
this content. However, if we include it inside the <legend> tag, some
screen readers might read it every time they move to a different
checkbox (or radio button), which can be annoying. Since I don't think
these help messages are really essential, I'm leaving them out of the
<legend> tag. It's also easier to style them if they're outside the
<legend> tag.

Note we're using `display: table` for the labels, for the reasons
mentioned in commit 923c2a7ee.

Also note that, when there's only one available locale, this section is
useless. In this case, we aren't disabling it for now because there's a
chance people see it in the official Consul Democracy demo and then
wonder why it isn't available on their installation. We might disable it
in the future, though.
2024-06-05 16:10:56 +02:00
Javi Martín
647121d13e Allow different locales per tenant
Note that, currently, we take these settings from the database but we
don't provide a way to edit them through the admin interface, so the
locales must be manually introduced through a Rails console.

While we did consider using a comma-separated list, we're using spaces
in order to be consistent with the way we store the allowed content
types settings.

The `enabled_locales` nomenclature, which contrasts with
`available_locales`, is probably subconsciously based on similar
patterns like the one Nginx uses to enable sites.

Note that we aren't using `Setting.enabled_locales` in the globalize
initializer when setting the fallbacks. This means the following test
(which we could add to the shared globalizable examples) would fail:

```
it "Falls back to an enabled locale if the fallback is not enabled" do
  Setting["locales.default"] = "en"
  Setting["locales.enabled"] = "fr en"
  allow(I18n.fallbacks).to receive(:[]).and_return([:fr, :es])
  Globalize.set_fallbacks_to_all_available_locales

  I18n.with_locale(:fr) do
    expect(record.send(attribute)).to eq "In English"
  end
end
```

The reason is that the code making this test pass could be:

```
def Globalize.set_fallbacks_to_all_available_locales
  Globalize.fallbacks = I18n.available_locales.index_with do |locale|
    ((I18n.fallbacks[locale] & Setting.enabled_locales) + Setting.enabled_locales).uniq
  end
end
```

However, this would make it impossible to run `rake db:migrate` on new
applications because the initializer would try to load the `Setting`
model but the `settings` table wouldn't exist at that point.

Besides, this is a really rare case that IMHO we don't need to support.
For this scenario, an installation would have to enable a locale, create
records with contents in that locale, then disable that locale and have
that locale as a fallback for a language where content for that record
wasn't created. If that happened, it would be solved by creating content
for that record in every enabled language.
2024-06-05 16:10:56 +02:00
Javi Martín
26b48e527a Move information texts form partial to a component
This way it'll be easierto write tests for it when we change it.
2024-06-05 16:10:56 +02:00