@@ -72,7 +72,7 @@ module.exports = {
72
72
## Usage
73
73
74
74
75
- ##### The MainComponent: Search Bar and sidebar
75
+ #### The MainComponent: Search Bar and sidebar
76
76
77
77
The MainComponent is what is demo'd in the introduction. It consists of the search bar and a sidebar for filters.
78
78
123
123
<% end %>
124
124
```
125
125
126
+ #### The MainComponent: Adding filters to the sidebar
127
+
128
+ Adding filters to the sidebar requires changes to two files though we recommend storing the data across three files and will demsontrate as such.
129
+
130
+ 1 . Add filters to Model
131
+ ``` ruby
132
+ # app/models/model.rb
133
+ class Model < ApplicationRecord
134
+ # inclusion statement from introduction
135
+
136
+ FILTER_SCOPE_MAPPINGS = {
137
+ # other filter scopes...
138
+ " model_type_filter" : :filter_by_type
139
+ }.freeze
140
+ # 'model_type_filter' will be referenced in step 2
141
+
142
+ ARRAY_FILTER_SCOPES = %i[model_type_filter] .freeze
143
+ # safelist of all filters we will be rendering in our sidebar
144
+
145
+ scope :filter_by_type , -> (model_type_input) { where(model_type: model_type_input) }
146
+ # where 'model_type' is an attribute defined on Model
147
+ end
148
+ ```
149
+
150
+ 2 . Create filter options
151
+ ``` ruby
152
+ # app/models/filter.rb
153
+ # We store in a filter.rb model, but you can store as desired
154
+ class Filter
155
+ MODEL_FILTERS = [
156
+ {
157
+ multi: true ,
158
+ title: " Type" ,
159
+ filter_name: " model_type_filter" ,
160
+ filters: %w(Special Normal) .map { |type | { name: type, value: type } }
161
+ # Allows us to filter between 'Special' and 'Normal' model types
162
+ # Note we recommend storing the %w(Special Normal) array at a central location for easier validation and manipulation
163
+ }
164
+ ].freeze
165
+ end
166
+ ```
167
+
168
+ 3 . Render as part of our MainComponent
169
+ ``` html
170
+ <!-- Notice the addition of a non-empty 'filters' argument which references step 2 -->
171
+ <%= render SnFilterable::MainComponent.new(frame_id: "some_unique_id", filtered: @search, filters: Filter::MODEL_FILTERS, search_filter_name: "search_name") do %>
172
+ <!-- display code.. -->
173
+ <% end %>
174
+ ```
175
+
126
176
## Testing / Development
127
177
128
178
This gem using [ RSpec] ( https://rspec.info ) for testing. Tests can be running locally by first setting up the dummy database/app as follows:
0 commit comments