Update number type to support custom currency format

design/specs/money-data-type.md

@@ -9,31 +9,48 @@ dateCreated: 2021-08-05T09:14:25.201Z
 ---
 
 # Context
+
 Money Data Types allow users to manage monetary values, preceded by a currency symbol of their choice.
 
 # Prototype
+
 > This prototype might be outdated due to global component updates. Please refer to the link under 'Setting Options' for an updated version of the shared components.
 {.is-warning}
 
 [Figma Prototype for Money Data Type](https://www.figma.com/proto/Uaf1ntcldzK2U41Jhw6vS2/Mathesar-MVP?page-id=3380%3A23047&node-id=3380%3A23048&viewport=-1070%2C505%2C0.4795173108577728&scaling=contain&starting-point-node-id=3380%3A23048)
 
 # User Experience
+
 ## Scenarios
 
 ### The user sets the type of a column with existing values to 'Money.'
+
 The user opens the menu for the desired column and selects the 'Data Type Options' menu item. From the list, they can set the type to money. Under advanced options, the user may set the currency and decimal places.
 
 #### Setting Options
+
 The following is an interactive representation of the various options that users can set for this type:
 [Money Type Options](https://www.figma.com/proto/Uaf1ntcldzK2U41Jhw6vS2/Mathesar-MVP?page-id=4260%3A37440&node-id=4270%3A40881&viewport=324%2C48%2C0.21&scaling=contain&starting-point-node-id=4270%3A40881&show-proto-sidebar=1)
 
 ### The user filters a 'Money' data type column
+
 The user can choose from multiple filter options to filter monetary values. The options will be the same as those used for numeric types.
 
 ### The user groups a 'Money' data type column
+
 The user might also choose to group the data based on the values of the 'Money' data type column.
 
 # Review Notes
+
 - For the MVP we'll assume the number locale format based on the selected currency. Eventually we can add options so that, for example, US dollars can be displayed with dot separators instead of commas. 
-- All locales will be included whenever there's a locale related option.
+- All locales will be included whenever there's a locale-related option.
+
+## Update 21 Feb 2022
+
+### Remove option to change currency
+
+The updated version will remove the option to change the currency from the money type. The data type menu will display only the current system locale. The system will inform the user that the selected currency will be updated if the locale settings are changed.
+
+#### Updated Prototype
 
+[Figma Prototype - Updated Money Type Display Options](https://www.figma.com/proto/Uaf1ntcldzK2U41Jhw6vS2/Mathesar-MVP?page-id=7552%3A83433&node-id=7590%3A84021&viewport=241%2C48%2C0.46&scaling=contain)

design/specs/number-data-type.md

@@ -9,9 +9,11 @@ dateCreated: 2021-07-23T20:02:57.303Z
 ---
 
 # Context
-Number data types allow users to add numeric values in different formats. 
 
-# Prototype
+Number data types allow users to add numeric values in different formats.
+
+## Prototype
+
 > This prototype might be outdated due to global component updates. Please refer to the link under 'Setting Options' for an updated version of the shared components.
 {.is-warning}
 
@@ -20,33 +22,73 @@ Number data types allow users to add numeric values in different formats.
 # User Experience
 
 ## Scenarios
+
 ### User sets number data type options
-A user can access the data type configuration of a field through the column menu. Depending on which data type is selected, the content of the configuration panel will change.
+
+A user can access the data type configuration of a table field via the column menu. Depending on which data type is selected, the content of the configuration panel will change.
 
 #### Setting Options
+
 The following is an interactive representation of the various options that users can set for this type:
 [Number Type Options](https://www.figma.com/proto/Uaf1ntcldzK2U41Jhw6vS2/Mathesar-MVP?page-id=4260%3A37440&node-id=4270%3A39634&viewport=324%2C48%2C0.21&scaling=contain&starting-point-node-id=4270%3A39634&show-proto-sidebar=1)
 
 ### User sets different data type formats
-When setting a number type, a user can pick from different formats, including decimals, floats, integers.
+
+When setting a number type, a user can pick from different formats, including decimals, floats, and integers.
 
 ### User filters the values of a number data type column
+
 A user can filter the values of a number data type column. The filtering options will vary depending on the type selected. 
 
 ### User groups records according to numeric values of a column
+
 A user can create groups based on the numeric values of a column. The User can choose to group by unique values or automatic ranges. Range options can be set so that groups are created by size or number of groups.
 
 #### User defines range manually
-A user can set a min and max value for a range and the increment size
+
+A user can set a min and max value for a range and the increment size.
+
 #### User defines ranges automatically
-A user can set the number of groups or the size for each group. If the parameter for the number of groups is set to 2, the range will be divided into two equal groups. If the group size parameter is set to 5, the values will be divided into ranges with an equal number of unique values. In this case, 5, not all groups will have the same number of equal values, as the total might not be divided into equal parts.
+A user can set the number of groups or the size for each group. If the number of groups is set to 2, the range will be divided into two equal groups. If the group size parameter is set to 5, the values will be divided into ranges with an equal number of unique values. In this case, 5, not all groups will have the same number of equal values, as the total might not be divided into equal parts.
 
 [Examples of Grouping by Range Options](https://www.figma.com/proto/Uaf1ntcldzK2U41Jhw6vS2/Mathesar-MVP?page-id=3458%3A26001&node-id=3469%3A27264&viewport=69%2C76%2C0.7793133854866028&scaling=min-zoom)
 
 ## Review Notes
+
 ### 'Friendly' and 'Database' type display
+
 We want to make sure users of all levels can understand and use the appropriate data types. Because the distinction between database types is sometimes not evident to beginner levels, we want to map them to more familiar categorizations. The design ensures that information will be available but prioritizes the user-friendly types in terms of visibility.
 
 ### Number type alignment
-Number types should be aligned to the right for easier reading of numbers with decimals.
 
+The interface should align number types to the right for easier reading of numbers with decimals.
+
+## Update 21 Feb 2022
+
+### Currency Format for Number Types
+
+Users can now format the number type to represent currency values when set to decimal. For this, users can add a currency symbol to the number and set options like showing a thousand separators or changing the position of the currency symbol.
+
+Additionally, the interface must inform the user that this is a display option and lacks specialized functionality provided by the `Money` data type.
+
+Changes to the `Money` data type are also required as part of this update. Refer to [Money Data Type Specs](/design/specs/money-data-type) for more information.
+
+#### Updated Prototype
+
+[Figma Prototype - Updated Number Type Display Options](https://www.figma.com/proto/Uaf1ntcldzK2U41Jhw6vS2/Mathesar-MVP?page-id=7552%3A83433&node-id=7552%3A83433&viewport=241%2C48%2C0.46&scaling=contain)
+
+#### Scenario: A user sets the number type to be displayed in currency format
+
+- The user sets a column type to `number.`
+- The user opens the data type menu and opens the `Display` section.
+- The user sets the `Format` option to `Currency` and [additional options](#currency_format_options) are displayed.
+- The user can change or leave the default options.
+- The user saves the data type changes.
+
+#### Currency Format Options
+
+- Select Symbol: Users can select the symbol that will be displayed along with the number. The currency symbol is set to $ (US Dollar) by default.
+- Symbol position: Users can select the position for the currency symbol. The options are start or end.
+- Digit Grouping: Options are '123456789','123,456,789','123456,789' or '12,34,56,789'
+- Digit Grouping Symbol: Options are 'none','thin space','.' or ','
+- Decimal Symbol: Options are '.' or ','