uis split out, hosted basics

01-getting-started/04-configuration.md → 01-getting-started/04-settings.md

@@ -1,4 +1,4 @@
-# Configuration
+# Settings
 Now that you have Directus installed, you can customize it for your specific project. The first Directus user is always an administrator, which gives you access to the Directus Settings by clicking on the gear at the bottom of the sidebar. 
 
 ----------

01-getting-started/07-hosted.md

@@ -5,13 +5,29 @@
 With a Directus Hosted account you can manage all your instances in one place, creating new Directus instances in seconds. Simply choose a name and size for your instance and within seconds you'll have a new SQL database ready to completely customize with your project's specific data architecture. Use the dynamic RESTful API to pull data into your app or website – or just use Directus as a standalone tool, similar to FileMaker. Either way, an unlimited number of users can upload files and manage database content, all based on granular group permissions.
 
 ### Your Account Dashboard
-TK
+From here you can manage your account info, including your email, password, and payment details. From this panel you can also review your account's billing history, see any outstanding balance you might have, and close your account.
 
 ### Creating Instances
-TK
+Once you have added payment info into your account you can easily and quickly add new instances. Just click on the "Create Instance" button in the header, fill in an instance name, and choose a plan – that's it. Names should be lowercase alphanumeric with dashes instead of spaces – choose your instance name carefully as that will determine your database name and API URL. It should only take a few second for your database and Directus CMS to be set up. Then, once you've created a schema and content, your dynamic API will be available.
 
 ### Managing Instances
-TK
+Once you've created a few instances, you can easily manage them all in one place from the Instances section. In addition to changing your instance's plan (resizing), you will also be presented with other details, including:
+
+* Table Count
+* User Count
+* Total Item Count
+* Used & Available Asset Storage
+* Used & Available Asset Bandwidth
+* Used & Available Monthly API Requests
+* Used & Available Monthly API Bandwidth
+
+You will also be able to see all of your API users/keys listed here. Each Directus user has an associated API key that inherits its data privileges. Keys can be be updated within the instance's Directus Users section.
 
 ### Deleting Instances
-TK
+You can delete instances from their detail page. There are three levels of confirmation to ensure you do not accidentally destroy instances. The following is permanently destroyed when deleting an instance:
+
+* The database
+* All data and content within the database
+* The Directus CMS
+* All associated assets
+* All API endpoints (404)

03-developer/04-inputs-and-interfaces.md → 03-user-interfaces/01-core-interfaces.md

@@ -59,7 +59,7 @@ This UI contains a masked input for entering a password, a second input to confi
 * `size`: Adjusts the max width of the input (Small, Medium, Large)
 * `allow_null`: Whether the input will allow for `NULL` values (empty input). If disabled then an empty input is converted to `0`.
 
-#### Color
+#### Hex Color
 *Supported Datatypes: **`VARCHAR`***
 
 Accepts only 6 hexadecimal characters and provides a live-colored square matching the value. This UI also uses the HTML5 color-chooser for easy color selection. Allowed hexadecimal characters include: `0123456789ABCDEF`
@@ -83,110 +83,6 @@ This UI provides a set of drop-downs and numerical inputs for entering months da
 
 ----------
 
-### Relational Data
-
-Since SQL is a relational database, Directus has several UIs that can help clearly and easily manage relationships between items. An item can have related items from the same table (eg: *Project -> Related Project*) or a different table (eg: *Project -> Category*). An item can also have relationships to a single item (eg: *Shirt -> Size*) in a Many-to-One (or One-to-Many) relationship, or to multiple items (eg *Shirt -> Materials*) through Many-to-Many relationships.
-
-**Many-to-One** (M2O) relationships save the `id` from another item as it's value, creating a dynamic relationship to that item. 
-
-**Many-to-Many** (M2M) relationships are quite a bit more complex, but very powerful. There are two things that are important to understand for M2Ms: Junction Tables, and Aliases. Let's use our *Shirt -> Materials* example from before to explore how this works:
-
-```
-shirt (Table)
-* id
-* name
-* size
-* "materials" (M2M Alias)
-
-materials (Table)
-* id
-* material
-
-shirt_materials (Junction Table)
-* id
-* shirt_id
-* material_id
-```
-
-**Junction Tables**
-We can't efficiently store multiple values in a single field, so M2M fields store all their relationships in a separate table called a "junction table" created just for this purpose. Junction tables are very simple – like all Directus tables they have an `id` column, but they also have two more columns for storing the IDs of the two items it's relating. In this case we're linking a shirts with their respective materials – so we have a `shirt_materials` junction table with `shirt_id` and `material_id` columns.
-
-**Aliases**
-Another thing you may have noticed is that the `materials` column says `Alias` and has quotes around it. Since we're not actually storing anything in that column (remember, values are stored in the Junction Table) we don't need to create it in the database. Instead, Directus uses an Alias column (like a ghost column) to represent a column for M2M UIs. Aliases columns don't exist in your database schema, they are added directly into the `directus_columns` table (a good place to look for bulk creation or troubleshooting).
-
-Since relational UIs can get slightly complex, if you can't get one working or run into issues check out our Troubleshooting Relationships section.
-
-#### Single File (M2O)
-*Supported Datatypes: **`INT`***
-
-This is a M2O relational UI that links a single file (and YouTube/Vimeo video embeds) by storing the related item's ID – which is why this UI only works with the INT datatype (also used for IDs). If you have a `books` table you could use this for the `cover_image` column, for a `projects` table this would be the UI used for columns like: `thumbnail_image`, `wireframe_pdf`, and `background_video`. Basically any column that needs to store a single file.
-
-* `allowed_filetypes`: A CSV of file extensions that this UI will accept. For video embeds you can use `vimeo` and `youtube` as the extension.
-
-#### Multiple Files (M2M)
-*Supported Datatypes: **`MANYTOMANY` (an alias datatype)***
-
-This is a M2M relational UI that links multiple files (and YouTube/Vimeo video embeds). If you have a `album` table you could use this to store mp3s within `tracks`, for a `projects` table this would be the UI used for columns like: `hero_slideshow`, `youtube_playlist`, and `press_pdfs`. Basically any column that needs to store multiple files.
-
-* `add_button`: Toggles an "Add" button for adding new files directly into the UI
-* `choose_button`: Toggles a "Choose" button that opens a modal with all existing Directus files to choose from
-* `remove_button`: Toggles "Remove" buttons for each file that let's you delete it
-
-#### Many-to-Many (M2M)
-*Supported Datatypes: **`MANYTOMANY` (an alias datatype)***
-
-This is a M2M relational UI that will make it easy to link the item being edited to multiple other items from another table (or the same table). You can use this to relate multiple `tags` to `projects`, or multiple `staff` to their respective `office`. But be careful about creating a schema/architecture with recursive or deeply nested M2Ms – otherwise you'll end up with a confusing "Matryoshka doll" user experience.
-
-* `visible_columns`: A column name (or CSV of column names) to show within the interface
-* `add_button`: Toggles an "Add" button for adding new items directly into the UI
-* `choose_button`: Toggles a "Choose" button that opens a modal with existing table items to choose from
-* `remove_button`: Toggles "Remove" buttons for each item that let's you delete it
-* `filter_type`: You have two options for how to filter this relational column from the Item Listing page depending on the size of your dataset:
-	* Dropdown: For small datasets, this gives a dropdown for easy filtering 
-	* Text Input: For larger datasets, this open field let's you filter by typing
-* `filter_column`: The column who's value is used for filtering
-* `visible_column_template`: Handlebars template notation for the fields to show in results. Eg: `{{first_name}} {{last_name}}`. All columns used here must be added to `visible_columns`
-* `min_entries`: Sets a minimum number of items that need to be added for this field to validate
-* `no_duplicates`: If enabled, items already linked will not show up in the Choose Item listing modal
-
-#### Many-to-One (M2O)
-*Supported Datatypes: **`INT`***
-
-This is a M2O relational UI drop-down that links to a single item by storing the related item's ID in the column – which is why this UI only works with the INT datatype (also used for IDs). You could use this to relate each item in your `press` table to a `project`, or to relate 
-
-* `readonly`: Disables editing of the field while still letting users see the value
-* `visible_column`: A column name (or CSV of column names) to show within the interface
-	* **TODO: update name to plural, this accepts CSV columns**
-* `visible_column_template`: Handlebars template notation for the fields to show in results. Eg: `{{first_name}} {{last_name}}`. All columns used here must be added to `visible_columns`
-* `visible_status_ids`: The values of the status column that will be shown/allowed in this UI. If the related table has a status column the default values are: `0 = deleted`, `1 = active`, `2 = draft`
-* `placeholder_text`: Grayed out default placeholder text in the input when it's empty
-* `filter_type`: You have two options for how to filter this relational column from the Item Listing page depending on the size of your dataset:
-	* Dropdown: For small datasets, this gives a dropdown for easy filtering 
-	* Text Input: For larger datasets, this open field let's you filter by typing
-* `filter_column`: The column who's value is used for filtering
-
-#### Many-to-One Type-Ahead
-*Supported Datatypes: **`INT`***
-
-Similar to the `Many-to-One` in function, the interface for this UI is a type-ahead (live search auto-complete) which is useful for large relational datasets that won't fit into a dropdown.
-
-* `visible_column`: The column name to show for items
-* `size`: Adjusts the max width of the input (Small, Medium, Large)
-* `template`: Handlebars template for displaying the items
-* `include_inactive`: Whether or not to include inactive (`2`) status items
-
-#### One-to-Many (O2M)
-*Supported Datatypes: **`ONETOMANY` (an alias datatype)***
-
-Similar to Many-to-One, this UI is an interface for the opposite direction. Instead of saving the `id` of a related item in an actual column, the One-to-Many is an Alias column that performs actions on related items.
-
-* `visible_columns`: Which columns to show for related items
-* `result_limit`: A maximum number of results to be returned before truncating results
-* `add_button`: Toggles an "Add" button for adding new items directly into the UI
-* `remove_button`: Toggles "Remove" buttons for each item that let's you delete it
-
-----------
-
 ### Lists and Other Inputs
 
 #### Select (Drop-down or Radio Buttons)
@@ -258,59 +154,4 @@ This UI provides an visual and interactive way to select a specific location, wh
 * `country_field`: Column name that will accept the country when a location is chosen
 * `countryCode_field`: Column name that will accept the country code (US) when a location is chosen
 * `mapHeight`: The height of the map in pixels. Default is 400px
-* `showLatLng`: 
-
-----------
-
-### System Inputs
-*These are Core UIs that are used exclusively by the Directus framework for internal purposes.*
-
-* directus_activity
-* directus_columns
-* directus_file
-* directus_file_size
-* directus_file_title
-* directus_messages_recipients
-* directus_user
-* directus_user_activity
-* directus_user_avatar
-
-----------
-
-### Other UIs to Document
-* blob
-* enum
-* random
-* system – **TODO: Rename to `status`**
-* template_chooser
-* translation
-* user
-
-----------
-
-### Custom Inputs & Interfaces
-Use the following steps to create your own custom user interfaces using the above as starter templates.
-
-1. Copy a Core UI file from `/app/core-ui` into the custom UI directory: `/ui`
-2. Set a unique name for the UI: `Module.id`
-3. Choose which SQL datatypes this UI will support: `Module.dataTypes`
-4. Optionally, add UI Options that admin users can adjust per column: `Module.variables`
-5. Draft up some markup with inline styling within the `template` variable.
-	* You will also see examples of escaped CSS in the template variable, but remember to namespace any styling.
-6. Add any validation into the `Module.validate` function which is called when attempting to save the model. If there is an error message the system automatically shows it as an alert. There are two parameters available within this function:
-	* **value**: String : Submitted value for this column's UI
-	* **options**: Object : Contains the options from `Module.variables` for this UI
-		* collection [TableCollection]
-		* model [EntriesModel]
-		* schema
-		* settings
-7. Finally, format the value for display on the Item Listing page within the `Module.list` function. There is one parameter available:
-	* **options**: Object : Contains the value and options for this UI
-		* value
-		* collection [TableCollection]
-		* model [EntriesModel]
-		* schema
-		* settings
-
-
-At this point, all you have to do is refresh your instance of Directus and your new UI will be available. If you go to `Settings > Tables & Inputs > []Table]` and open the User Interface dropdown for the desired column, if that column's datatype is supported you will see your UI as an option. If you don't see it, confirm that that datatype is listed in `Module.dataTypes` and that the `Module.id` is unique – otherwise check the error logs.
+* `showLatLng`: