diff --git a/packages/admin/docs/content/attributes.md b/packages/admin/docs/content/attributes.md
new file mode 100644
index 000000000..d658ba0a5
--- /dev/null
+++ b/packages/admin/docs/content/attributes.md
@@ -0,0 +1,2 @@
+# Attributes
+Coming Soon...
diff --git a/packages/admin/docs/content/brands.md b/packages/admin/docs/content/brands.md
new file mode 100644
index 000000000..ffa0d60eb
--- /dev/null
+++ b/packages/admin/docs/content/brands.md
@@ -0,0 +1,233 @@
+# Brands
+Most e-commerce sites sell products from several manufacturers. And each supplier can be represented by a brand.
+
+Unless you make your own products, you should always register the brands of your products in Shopper.
+
+If you sell your own products, you must at least create your company as a brand: this helps your customer find what they are looking for, and this can bring some valuable search engine points.
+
+## Overview
+The management of brands is exactly the same as the one done in most of the e-commerce website creation tools: only the name can change. It is mainly used to facilitate the navigation of customers in your catalog, as it is increasingly common to search for a specific brand.
+
+
+
+
Brands
+
+
+New brands are automatically activated and available for your online store, even if they do not contain any products yet. You must deactivate them so that they do not appear online.
+
+### Fields
+The model used is `Shopper\Framework\Models\Shop\Product\Brand`.
+
+| Name | Type | Required | Notes |
+|-------------|-----------|------------|------------|
+| `id` | autoinc | | auto |
+| `name` | string | yes | |
+| `slug` | string | yes | Unique, default value is auto generated using brand name |
+| `website` | string | no | Nullable |
+| `description` | longText | no | Nullable |
+| `position` | string | no | Default `0` |
+| `is_enabled` | boolean | no | Default `false` |
+| `seo_title` | string | no | Nullable, for seo title max length is 60 |
+| `seo_description` | string | no | Nullable, for seo description max length is 160 |
+
+:::tip
+Models are customizable, and we recommend changing the **Brand** model when you configure your site.
+To change the model you need to look at the configuration file `config/shopper/system.php` at the key `models`.
+:::
+
+```php
+return [
+ 'models' => [
+ /*
+ * Eloquent model should be used to retrieve your brands. Of course,
+ * it is often just the "Brand" model but you may use whatever you like.
+ *
+ * The model you want to use as a Brand model needs to extends the
+ * `\Shopper\Framework\Models\Shop\Product\Brand` model.
+ */
+ 'brand' => \Shopper\Framework\Models\Shop\Product\Brand::class, // [tl! focus]
+
+ /*
+ * Eloquent model should be used to retrieve your categories. Of course,
+ * it is often just the "Category" model but you may use whatever you like.
+ *
+ * The model you want to use as a Category model needs to extends the
+ * `\Shopper\Framework\Models\Shop\Product\Category` model.
+ */
+ 'category' => \Shopper\Framework\Models\Shop\Product\Category::class,
+ ]
+];
+```
+
+1. Create your own model that you have to use
+ ```bash
+ php artisan make:model Brand
+ ```
+ Once the `app/Models/Brand.php` model is created in our app folder, we will make it extend from the `Shopper\Framework\Models\Shop\Product\Brand` model available in Shopper.
+
+2. Extend our Brand model from the Brand Shopper Model
+ ```php
+ namespace App\Models;
+
+ use Shopper\Framework\Models\Shop\Product;
+
+ class Brand extends Product\Brand
+ {
+ }
+ ```
+
+3. Update `brand` key for the model on the `system.php` config file to use our new model
+ ```php
+ return [
+ 'models' => [
+ /*
+ * Eloquent model should be used to retrieve your brands. Of course,
+ * it is often just the "Brand" model but you may use whatever you like.
+ *
+ * The model you want to use as a Brand model needs to extends the
+ * `\Shopper\Framework\Models\Shop\Product\Brand` model.
+ */
+ 'brand' => \App\Models\Brand::class, // [tl! focus]
+
+ /*
+ * Eloquent model should be used to retrieve your categories. Of course,
+ * it is often just the "Category" model but you may use whatever you like.
+ *
+ * The model you want to use as a Category model needs to extends the
+ * `\Shopper\Framework\Models\Shop\Product\Category` model.
+ */
+ 'category' => \Shopper\Framework\Models\Shop\Product\Category::class,
+ ]
+ ];
+ ```
+
+### Components
+Livewire components for managing brands are available in the component configuration file `config/shopper/components.php`.
+
+```php
+use Shopper\Framework\Http\Livewire;
+
+return [
+ 'livewire' => [
+ 'brands.browse' => Livewire\Brands\Browse::class,
+ 'brands.create' => Livewire\Brands\Create::class,
+ 'brands.edit' => Livewire\Brands\Edit::class,
+
+ 'tables.brands-table' => Livewire\Tables\BrandsTable::class,
+ ];
+];
+```
+
+For handling tables in Shopper, we use [Laravel Livewire Tables](https://github.com/rappasoft/laravel-livewire-tables) package by Anthony Rappa.
+
+## Manage Brands
+The brands are accessible via the Brands Menu on the left sidebar. The display page is rendered by the Livewire component `Shopper\Framework\Http\Livewire\Brands\Browse` and for the display of the brands table is the component `Shopper\Framework\Http\Livewire\Tables\BrandsTable`.
+
+You can modify them in the component configuration file to use your own.
+
+### Create brand
+Click on the "Create" button on the brands page, and a creation form appears.
+
+
+
+
Create brand
+
+
+Save your changes in order to be taken back to the brand's list. Required fields are marked with an **asterisk (*)**
+
+The SEO section allows you to define how your brand information should be displayed in search engines. To modify the content you click on the button "Edit SEO preview"
+
+
+
+
Brand SEO
+
+
+By fill the data you will have a direct preview of the content.
+
+### Delete brand
+To delete, deactivate or activate brands, you need to select the brand you want to delete and then click on the "Bulk Actions" button to choose the action you want to perform.
+
+
+
+
Delete brand
+
+
+## Retrieve Data
+Once you have your brands and you want to display them in your store, you can retrieve them this way in your controller
+
+```php
+namespace App\Http\Controllers;
+
+use App\Models\Brand;
+use App\Models\Product;
+use Carbon\Carbon;
+
+class HomeController extends Controller
+{
+ public function home()
+ {
+ $products = Product::with('categories', 'attributes')
+ ->publish()
+ ->take(8)
+ ->get()
+ ->map(function ($product) {
+ $product['is_new'] = $product->created_at
+ ->addDays(8)
+ ->greaterThanOrEqualTo(Carbon::now());
+
+ return $product;
+ });
+
+ return view('home', [
+ 'products' => $products,
+ 'brands' => Brand::query()->get()->take(12), // [tl! focus]
+ ]);
+ }
+}
+```
+
+:::tip
+Knowing that your brands can be displayed on several pages and places in your store, you can create a **View Composer** ([read more about View Composer](https://laravel.com/docs/9.x/views#view-composers)).
+:::
+
+- Create your brand composer undo a custom folder `app/View/Composers`
+
+```php
+namespace App\View\Composers;
+
+use App\Models\Brand;
+use Illuminate\View\View;
+
+class BrandsComposer
+{
+ public function compose(View $view)
+ {
+ $view->with('brands', Brand::enabled()->get()->take(12));
+ }
+}
+```
+
+- Then you have to add it in your **AppServiceProvider**
+
+```php
+namespace App\Providers;
+
+use App\View\Composers\BrandsComposer;
+use Illuminate\Support\Facades\View;
+use Illuminate\Support\ServiceProvider;
+
+class AppServiceProvider extends ServiceProvider
+{
+ public function boot()
+ {
+ View::composer('partials.brands', BrandsComposer::class); // [tl! focus]
+ }
+}
+```
+
+And in your front-end you can browse your brands to have a display like this
+
+
+
+
Brands example list
+
diff --git a/packages/admin/docs/content/categories.md b/packages/admin/docs/content/categories.md
new file mode 100644
index 000000000..561311181
--- /dev/null
+++ b/packages/admin/docs/content/categories.md
@@ -0,0 +1,268 @@
+# Categories
+Categories are the primary way to group products with similar features. You can also add subcategories if desired.
+
+For example, if you sell clothing, you might have “t-shirts”, “hoodies” and “pants” as categories.
+
+## Overview
+Shopper gives you a possibility to categorize your products in a very flexible way, which is one of the most vital functionalities of the modern e-commerce systems. The categories system in Shopper use the [Laravel Adjacency List](https://github.com/staudenmeir/laravel-adjacency-list) package to create categories trees like this
+
+```plain theme:github-light
+Category
+ |
+ |\__ Women
+ | \_ T-Shirts
+ | \_ Shirts
+ | \_ Dresses
+ | \_ Shoes
+ |
+ |\__ Men
+ | \_ Accessories
+ | |--> Bags
+ | |--> Jeans
+ | |--> Sunglasses
+ | \_ Jeans
+ | \_ T-shirts
+ | \_ Shoes
+ |
+```
+
+
+
+
Categories
+
+
+### Fields
+The model used is `Shopper\Core\Models\Category`.
+
+| Name | Type | Required | Notes |
+|-------------|-----------|------------|------------|
+| `id` | autoinc | | auto |
+| `name` | string | yes | |
+| `slug` | string | yes | Unique, default value is generated using category name |
+| `description` | longText | no | Nullable |
+| `position` | string | no | Default `0` |
+| `is_enabled` | boolean | no | Default `false` |
+| `seo_title` | string | no | Nullable, for seo title max length is 60 |
+| `seo_description` | string | no | Nullable, for seo description max length is 160 |
+| `parent_id` | bigint | no | |
+
+:::tip
+Models are customizable, and we recommend changing the **Category** model when you configure your store.
+To change the model you need to look at the configuration file `config/shopper/models.php`.
+:::
+
+Let's keep in mind the modification that was made in the previous section regarding [Brands](/brands).
+
+```php
+use Shopper\Core\Models;
+
+return [
+ // ...
+ 'brand' => \App\Models\Brand::class,
+
+ // ...
+ 'category' => Models\Category::class, // [tl! focus]
+];
+```
+
+1. Create your own model that you have to use
+ ```bash
+ php artisan make:model Category
+ ```
+ Once the `app/Models/Category.php` model is created in our app folder, we will make it extend from the `Shopper\Core\Models\Category` model available in Shopper.
+
+2. Extend our Category model from the Category Shopper Model
+ ```php
+ namespace App\Models;
+
+ use Shopper\Core\Models\Category as Model;
+
+ class Category extends Model
+ {
+ }
+ ```
+
+3. Update `category` key for the model on the `shopper/models.php` config file to use our new model
+ ```php
+ return [
+ 'models' => [
+ // ...
+ 'brand' => \App\Models\Brand::class,
+
+ // ...
+ 'category' => \App\Models\Category::class, // [tl! focus]
+ ]
+ ];
+ ```
+
+### Components
+Livewire components for managing categories are available in the component configuration file `config/shopper/components.php`.
+
+```php
+use Shopper\Http\Livewire;
+
+return [
+ 'livewire' => [
+
+ 'categories.browse' => Livewire\Categories\Browse::class,
+ 'categories.create' => Livewire\Categories\Create::class,
+ 'categories.edit' => Livewire\Categories\Edit::class,
+
+ 'tables.categories-table' => Livewire\Tables\CategoriesTable::class,
+
+ ];
+];
+```
+
+## Manage Categories
+Categories are determinant of how people will navigate on your site and search for your products. You should focus on your category tree and how categories are organized even before you start creating product sheets.
+
+The categories are accessible via the **Categories** Menu on the left sidebar. The display page is rendered by the Livewire component `Shopper\Framework\Http\Livewire\Categories\Browse` and for the display of the categories table is the component `Shopper\Framework\Http\Livewire\Tables\CategoriesTable`.
+
+You can modify them in the component configuration file to use your own.
+
+### Create category
+Click on the "Create" button on the categories page, and a creation form appears.
+
+
+
+
Create category
+
+
+Save your changes in order to be taken back to the categories list. Required fields are marked with an **asterisk (*)**
+
+The SEO section allows you to define how your category information should be displayed in search engines. To modify the content you click on the button "Edit SEO preview". It uses the same blade component as the brands.
+
+
+
+
Seo form preview
+
+
+Once you have finished configuring your category, save it, and you are ready to fill it with products.
+
+If you use another interface (e.g. API) to save your categories, you can save directly using your Model
+
+```php
+use App\Models\Category;
+
+$category = Category::create([
+ 'name' => $name = 'Clothes',
+ 'slug' => $name,
+ 'is_enabled' => true,
+]);
+```
+
+The slug cannot be null, you have to fill in the value of the category name and according to that the slug will be generated.
+
+In case a slug already exists, the slug will be automatically extended to prevent duplicates:
+
+```php
+use App\Models\Category;
+
+$category1 = Category::create(['name' => 'Category', 'slug' => 'Category']);
+$category2 = Category::create(['name' => 'Category', 'slug' => 'Category']);
+
+echo $category1->slug;
+// category
+
+echo $category2->slug;
+// category-1
+```
+
+And if the category has a parent, the child's slug will be generated with the parent's directly
+
+This generation is done when adding a category in Shopper. But you can change this behavior by extending the category create [Shopper\Framework\Http\Livewire\Categories\Create](https://github.com/shopperlabs/framework/blob/main/src/Http/Livewire/Categories/Create.php) Livewire component or by creating a new one.
+
+```php
+use App\Models\Category;
+
+$category = Category::create(['name' => 'Photo', 'slug' => 'photo']);
+$categoryChild = Category::create([
+ 'name' => 'Camera',
+ 'slug' => $this->parent ? $this->parent->slug . '-' . 'Camera' : 'Camera',
+ 'parent_id' => $caregory->id
+]);
+
+echo $category->slug;
+// photo
+
+echo $categoryChild->slug;
+// photo-camera
+```
+
+#### Create Category with parent
+
+```php
+use App\Models\Category;
+
+$parent = Category::create([
+ 'name' => $name = 'Clothes',
+ 'slug' => $name,
+ 'is_enabled' => true,
+]);
+
+$child = Category::create([
+ 'name' => 'Jeans',
+ 'slug' => 'jeans',
+ 'parent_id' => $parent->id, // [tl! focus]
+ 'is_enabled' => true,
+]);
+```
+
+On Shopper, to specify the parent category you just have to choose via the select field
+
+
+
+
Category parent
+
+
+### Update category
+The "Modify" button allows you to modify the category.
+
+:::info
+It is important to know that if you update the category name, the slug will automatically be updated as well.
+:::
+
+
+
+
Update Category
+
+
+## Retrieve Data
+With Shopper Framework you are the master of your front-end. After extending the model you can make all the necessary queries to retrieve your data.
+
+We just recommend that you always use the `enabled` scope to ensure that only active categories are visible
+
+```php
+use App\Models\Category;
+
+$categories = Category::enabled()->get(),
+```
+
+To find a category with his children or parent, etc. The following functions are available.
+
+- `ancestors()`: The model's recursive parents.
+- `ancestorsAndSelf()`: The model's recursive parents and itself.
+- `bloodline()`: The model's ancestors, descendants and itself.
+- `children()`: The model's direct children.
+- `childrenAndSelf()`: The model's direct children and itself.
+- `descendants()`: The model's recursive children.
+- `descendantsAndSelf()`: The model's recursive children and itself.
+- `parent()`: The model's direct parent.
+- `parentAndSelf()`: The model's direct parent and itself.
+- `rootAncestor()`: The model's topmost parent.
+- `siblings()`: The parent's other children.
+- `siblingsAndSelf()`: All the parent's children.
+
+```php
+$ancestors = Category::find($id)->ancestors;
+$categories = Category::with('descendants')->get();
+$categories = Category::whereHas('siblings', function ($query) {
+ $query->where('name', '=', 'Photo');
+})->get();
+$total = Category::find($id)->descendants()->count();
+Category::find($id)->descendants()->update(['is_enabled' => false]);
+Category::find($id)->siblings()->delete();
+```
+
+The complete documentation is available in the readme of [Laravel Adjacency List](https://github.com/staudenmeir/laravel-adjacency-list)
diff --git a/packages/admin/docs/content/collections.md b/packages/admin/docs/content/collections.md
new file mode 100644
index 000000000..4d776034e
--- /dev/null
+++ b/packages/admin/docs/content/collections.md
@@ -0,0 +1,261 @@
+# Collections
+Collections, although not strictly the same, are akin to Categories. They serve to allow you to add products ,either explicitly or via certain criteria, for use on your store.
+
+In most e-commerce tools, collections are considered as categories. And especially on Shopify, collections are a great feature for grouping products.
+
+And for the constitution of the collections we got closer to what Shopify offers in terms of configuration, and the management of collections in Shopper is inspired by Shopify.
+
+## Context
+For example if you have a store that sells various electronic products, you will probably have categories like "Phones", "Computers", "Cameras" etc. Each of these categories may have several products that can be listed.
+
+And to try to group the products in an even more detailed way you can create for example a collection called "Gaming Collection" and specify in this collection that any product with certain conditions can be included.
+
+And that Gaming Collection can have products that even come from various categories in your site (desktop, laptop, monitor, and many others of the same type) or that don't even have categories (very rare case in e-commerce sites).
+
+Let's use Netflix as an example. Categories are essentially genres: adventure, action, horror, romance, etc., while collections are similar to a TV series or movie sequels that are ultimately meant to be viewed together.
+
+## Collections vs Categories
+The question is essential, it is difficult to find this type of configuration on e-commerce tools because most of the time categories, collections or taxonomies are used to perform the same action **group products**.
+
+The advantage of having collections in addition to categories in Shopper is to differentiate or optimize the search for products by customers in your store.
+
+### Depth
+A collection can't have a child or a parent like a category. So all the collections are at the same hierachical level.
+
+### Condition
+Where products can be added to any category, collections cannot. Depending on the type of collection you want to create (Manual or Automatic) you will find yourself creating conditions or rules for the products that should be in that collection.
+
+## Overview
+As mentioned above, the collections in Shopper are inspired by [Shopify collections](https://help.shopify.com/en/manual/products/collections). So there are also 2 types of collections: "Manual" and "Automatic" and the configuration for each is different.
+
+
+
+
Collections
+
+
+### Fields
+As the collections can be automatic, they are managed by 2 Models, the Collection model and the model for rules associated with automatic collections.
+
+Manual collections do not need to have rules.
+
+- Collection model is `Shopper\Framework\Models\Shop\Product\Collection`.
+- Rule model is `Shopper\Framework\Models\Shop\Product\CollectionRule`
+
+**Collection Model**
+
+| Name | Type | Required | Notes |
+|-------------|-----------|------------|------------|
+| `id` | autoinc | | auto |
+| `name` | string | yes | |
+| `slug` | string | yes | Unique, default value is generated using collection name |
+| `description` | longText | no | Nullable |
+| `type` | enum | yes | Values `['manual', 'auto']` |
+| `sort` | string | no | Nullable, potential values `alpha_asc`, `alpha_desc`, `price_desc`, `price_asc`, `created_desc`, `created_asc` |
+| `match_conditions` | enum | no | Nullable, `['all', 'any']` |
+| `published_at` | dateTimeTz | no | Default `now()` |
+
+**CollectionRule Model**
+
+| Name | Type | Required | Notes |
+|-------------|-----------|------------|------------|
+| `id` | autoinc | | auto |
+| `rule` | string | yes | current values `product_title`, `product_price`, `compare_at_price`, `inventory_stock`, `product_brand`, `product_category` |
+| `operator` | string | yes | current values `equals_to`, `not_equals_to`, `less_than`, `greater_than`, `starts_with`, `ends_with`, `contains`, `not_contains` |
+| `value` | string | yes | |
+| `collection_id` | bigint | no | Collection ID |
+
+:::tip
+Models are customizable, and we recommend changing the **Collection** model when you configure your store.
+To change the model you need to look at the configuration file `config/shopper/system.php` at the key `models`.
+:::
+
+Let's keep in mind the modification that was made in the previous section regarding [Categories](/categories).
+
+```php
+return [
+ 'models' => [
+ /*
+ * Eloquent model should be used to retrieve your categories. Of course,
+ * it is often just the "Category" model but you may use whatever you like.
+ *
+ * The model you want to use as a Category model needs to extends the
+ * `\Shopper\Framework\Models\Shop\Product\Category` model.
+ */
+ 'category' => \App\Models\Category::class,
+
+ /*
+ * Eloquent model should be used to retrieve your collections. Of course,
+ * it is often just the "Collection" model but you may use whatever you like.
+ *
+ * The model you want to use as a Collection model needs to extends the
+ * `\Shopper\Framework\Models\Shop\Product\Collection` model.
+ */
+ 'collection' => \Shopper\Framework\Models\Shop\Product\Collection::class, // [tl! focus]
+ ]
+];
+```
+
+1. Create your own model that you have to use
+ ```bash
+ php artisan make:model Collection
+ ```
+ Once the `app/Models/Collection.php` model is created in our app folder, we will make it extend from the `Shopper\Framework\Models\Shop\Product\Collection` model available in Shopper.
+
+2. Extend our Collection model from the Collection Shopper Model
+ ```php
+ namespace App\Models;
+
+ use Shopper\Framework\Models\Shop\Product;
+
+ class Collection extends Product\Collection
+ {
+ }
+ ```
+
+3. Update `Collection` key for the model on the `system.php` config file to use our new model
+ ```php
+ return [
+ 'models' => [
+ /*
+ * Eloquent model should be used to retrieve your categories. Of course,
+ * it is often just the "Category" model but you may use whatever you like.
+ *
+ * The model you want to use as a Category model needs to extends the
+ * `\Shopper\Framework\Models\Shop\Product\Category` model.
+ */
+ 'category' => \App\Models\Category::class,
+
+ /*
+ * Eloquent model should be used to retrieve your collections. Of course,
+ * it is often just the "Collection" model but you may use whatever you like.
+ *
+ * The model you want to use as a Collection model needs to extends the
+ * `\Shopper\Framework\Models\Shop\Product\Collection` model.
+ */
+ 'collection' => \App\Models\Collection::class, // [tl! focus]
+ ]
+ ];
+ ```
+
+### Components
+Livewire components for managing collections are available in the component configuration file `config/shopper/components.php`.
+
+```php
+use Shopper\Framework\Http\Livewire;
+
+return [
+
+ 'livewire' => [
+
+ 'collections.browse' => Livewire\Collections\Browse::class,
+ 'collections.create' => Livewire\Collections\Create::class,
+ 'collections.edit' => Livewire\Collections\Edit::class,
+ 'collections.products' => Livewire\Collections\Products::class,
+
+ 'tables.collections-table' => Livewire\Tables\CollectionsTable::class,
+
+ ];
+
+];
+```
+
+## Manage Collections
+Form your Shopper admin on the sidebar go to **Collections**. The display page is rendered by the Livewire component `Shopper\Framework\Http\Livewire\Collections\Browse` and for the display of the collections table is the component `Shopper\Framework\Http\Livewire\Tables\CollectionsTable`.
+
+By default you will see this page without data which is rendered by a blade component of Shopper called [empty state](/extending/empty-state).
+
+
+
+
Collections empty data
+
+
+### Create collection
+Click on the "Create" button on the collections page, and a creation form appears.
+
+
+
+
Create collection
+
+
+Save your changes in order to be taken back to the collections list. Required fields are marked with an **asterisk (*)**.
+
+You can create two types of collections as we said: Automatic and manual collection.
+
+Only automatic collections have rules for automating them. When you choose to create an automatic collection the rules section will be available in the creation form
+
+
+
+
Automatic collection rules
+
+
+After you create a collection, you can't change its type.
+
+The Livewire component for collection creation is `Shopper\Framework\Http\Livewire\Collections\Create`. Here is the function to save a collection
+
+```php
+namespace Shopper\Framework\Http\Livewire\Collections;
+
+use Shopper\Framework\Models\Shop\Product\CollectionRule;
+use Shopper\Framework\Repositories\Ecommerce\CollectionRepository;
+
+class Create extends Component
+{
+ public function store()
+ {
+ $this->validate($this->rules());
+
+ $collection = (new CollectionRepository())->create([
+ 'name' => $this->name,
+ 'slug' => $this->name,
+ 'description' => $this->description,
+ 'type' => $this->type,
+ 'match_conditions' => $this->condition_match,
+ 'seo_title' => $this->seoTitle,
+ 'seo_description' => $this->seoDescription,
+ 'published_at' => $this->publishedAt ?? now(),
+ ]);
+
+ if ($this->fileUrl) {
+ $collection->addMedia($this->fileUrl)
+ ->toMediaCollection(config('shopper.system.storage.disks.uploads'));
+ }
+
+ if ($this->type === 'auto' && count($this->conditions) > 0 && $this->rule) {
+ foreach ($this->rule as $key => $value) {
+ CollectionRule::query()->create([
+ 'collection_id' => $collection->id,
+ 'rule' => $this->rule[$key],
+ 'operator' => $this->operator[$key],
+ 'value' => $this->value[$key],
+ ]);
+ }
+
+ $this->conditions = [];
+ $this->resetConditionsFields();
+ }
+
+ session()->flash('success', __('Collection successfully added!'));
+
+ $this->redirectRoute('shopper.collections.edit', $collection);
+ }
+}
+```
+
+## Retrieve Data
+After extending the Shopper Collection model you can use your own model to retrieve data from the database. Here an example code.
+
+```php
+use App\Models\Collection;
+
+// To retrieve only manual collections
+$collections = Collection::manual()->get();
+// To retrieve collection by slug
+$collection = Collection::findBySlug('summers-clothes');
+```
+
+To view the image of a collection you can consult the [media documentation](/media#retrieving-images). And you can display collections in your frontend.
+
+
+
+
Example display for collections
+
diff --git a/packages/admin/docs/content/configuration.md b/packages/admin/docs/content/configuration.md
new file mode 100644
index 000000000..8662787db
--- /dev/null
+++ b/packages/admin/docs/content/configuration.md
@@ -0,0 +1,243 @@
+# Configuration
+Shopper uses standard Laravel config files and environment variables for application-level settings
+
+## Config Files
+With the installation of Shopper you will find new configurations files located in `config/shopper/`. They are PHP files named by area of responsibility.
+
+``` files theme:github-light
+config/shopper/
+ admin.php
+ auth.php
+ components.php
+ core.php
+ media.php
+ models.php
+ routes.php
+ settings.php
+```
+
+And the `admin.php` is the main file, you can find various options to change the configuration of your Shopper installation.
+
+## System
+All the basic configurations for using shopper can be found in this file. The management of the locale, the models to use and additional resources (scripts and styles) to the administration.
+
+### Brand logo
+By default, the Shopper logo will be used as the brand logo in the administration panel.
+
+To update it you just have to fill in the logo link in your public folder
+
+```php
+/*
+ |--------------------------------------------------------------------------
+ | Brand Name
+ |--------------------------------------------------------------------------
+ |
+ | This will be displayed on the login page and in the sidebar's header.
+ |
+ */
+
+ 'brand' => '/img/screenshots/{{version}}/logo.svg',
+```
+
+### Controllers
+By default Shopper loads controllers that are defined in this namespace. You can change it if you have a different structure. These controllers are used to extend and add functionalities in the administration.
+
+In your config file you have the controllers key that define the controller's namespace for your extended Controllers:
+
+``` php
+'controllers' => [
+ 'namespace' => 'App\\Http\\Controllers\\Shopper',
+],
+```
+
+### Models
+Models used are defined in the models key, if you want to use your own models you can replace them on the `models.php` config file.
+
+``` php
+
+ 'brand' => \Shopper\Core\Models\Brand::class,
+
+ 'category' => \Shopper\Core\Models\Category::class,
+
+ 'collection' => \Shopper\Core\Models\Collection::class,
+
+ 'product' => \Shopper\Core\Models\Product::class,
+
+```
+
+### Additional resources
+During your work you may need to add your own style tables or javascript scenarios globally for all the pages, so you need to add them to relevant arrays.
+
+```php
+'resources' => [
+ 'stylesheets' => [
+ //'css/custom.css',
+ ],
+ 'scripts' => [
+ //'js/custom.js',
+ ],
+],
+```
+
+## Routes
+The configuration of the routes allows you to specify a prefix to access your dashboard, the addition of middleware and the configuration file to add more routes to your administration.
+
+### Prefix
+
+```php
+// config/shopper/admin.php
+'prefix' => env('SHOPPER_PREFIX', 'cpanel'),
+```
+
+The system installed on the website can be easily defined by the dashboard prefix, for example it is `wp-admin` for WordPress, and it gives an opportunity to automatically search for old vulnerable versions of software and gain control over it.
+
+There are other reasons but we won't speak of them in this section. The point is that Shopper allows to change dashboard prefix to every other name, `admin` or `administrator` for example.
+
+### Middleware
+
+```php
+// config/shopper/routes.php
+'middleware' => [],
+```
+
+Shopper gives you the ability to add middleware to all of your routes. These middlewares will be applied to all the routes of your administration.
+
+### Additional dashboard routes
+
+```php
+// Eg.: base_path('routes/shopper.php')
+'custom_file' => null,
+```
+
+By default none of your routes in the `web.php` file will be accessible and loaded in the shopper administration. So that your routes added in the sidebar can have the middleware applied to the dashboard, you must fill in an additional routing file and this will be automatically loaded by Shopper's internal RouteServiceProvider.
+
+## Components
+The main features of Laravel Shopper is to handle Livewire components to add new functionnalities to your admin panel.
+
+For this purpose you have a component file that lists all Livewire components used within Laravel Shopper. You can for each feature modify the associated or extends component to add functionality or even change the view to fit your own logic.
+
+Here is an example of some components
+
+```php
+use Shopper\Http\Livewire\Components;
+
+return [
+ /*
+ |--------------------------------------------------------------------------
+ | Livewire Components
+ |--------------------------------------------------------------------------
+ |
+ | Below you reference all the Livewire components that should be loaded
+ | for your app. By default all components from Shopper Kit are loaded in.
+ |
+ */
+ 'livewire' => [
+ 'account.devices' => Components\Account\Devices::class,
+ 'account.dropdown' => Components\Account\Dropdown::class,
+ 'account.password' => Components\Account\Password::class,
+ ],
+];
+```
+
+## Settings
+Settings are a very important part of an e-commerce site administration. Shopper has understood this very well and has set up a settings file, to allow you to add or modify the default settings of Shopper.
+
+In this file you can add parameters or delete those you don't need to simplify your store or to make it larger
+
+```php
+return [
+
+ /*
+ |--------------------------------------------------------------------------
+ | Setting Menu
+ |--------------------------------------------------------------------------
+ |
+ | The menu for the generation of the page settings and layout.
+ | BladeUIKit Heroicon is the icon used. See https://blade-ui-kit.com/blade-icons?set=1
+ |
+ */
+
+ 'items' => [
+ [
+ 'name' => 'General',
+ 'description' => 'View and update your store information.',
+ 'icon' => 'heroicon-o-cog',
+ 'route' => 'shopper.settings.shop',
+ 'permission' => null,
+ ],
+ [
+ 'name' => 'Staff & permissions',
+ 'description' => 'View and manage what staff can see or do in your store.',
+ 'icon' => 'heroicon-o-users',
+ 'route' => 'shopper.settings.users',
+ 'permission' => null,
+ ],
+
+ ],
+];
+```
+
+## Mapbox
+Shopper uses Mapbox to enter the geographic coordinates (latitude and longitude) of your store so that you can easily tell your customers your location.
+
+To activate mapbox you need to go to the [API](https://docs.mapbox.com/mapbox-gl-js/api/) documentation and create an API token. Once this is done you need to add the key `MAPBOX_PUBLIC_TOKEN` with the token value to your `.env` file
+
+```bash
+MAPBOX_PUBLIC_TOKEN=your_token_here
+```
+
+## Update Configurations
+In your `config/filesystems.php` config file add the following to the disks and links section:
+
+``` php
+'disks' => [
+ // Shopper Uploads Disks. [tl! highlight:13]
+ 'avatars' => [ // [tl! collapse:start]
+ 'driver' => 'local',
+ 'root' => storage_path('app/avatars'),
+ 'url' => env('APP_URL').'/avatars',
+ 'visibility' => 'public',
+ ], // [tl! collapse:end]
+
+ 'uploads' => [ // [tl! collapse:start]
+ 'driver' => 'local',
+ 'root' => storage_path('app/uploads'),
+ 'url' => env('APP_URL').'/uploads',
+ 'visibility' => 'public',
+ ], // [tl! collapse:end]
+
+],
+
+/*
+|--------------------------------------------------------------------------
+| Symbolic Links
+|--------------------------------------------------------------------------
+|
+| Here you may configure the symbolic links that will be created when the
+| `storage:link` Artisan command is executed. The array keys should be
+| the locations of the links and the values should be their targets.
+|
+*/
+
+'links' => [
+ // [tl! highlight:2]
+ public_path('avatars') => storage_path('app/avatars'),
+ public_path('uploads') => storage_path('app/uploads'),
+],
+
+```
+
+### Create New Folders
+After adding the 2 entries in the filesystem config file, you must create them and add them to the .gitignore file.
+In your storage directory create 2 new folders called `avatars` and `uploads`.
+
+```bash
+mkdir storage/app/avatars && mkdir storage/app/uploads
+```
+
+In each new folder that you have created (avatars and uploads) you must create a .gitignore file which will contain the following line
+
+```bash
+*
+!.gitignore
+```
diff --git a/packages/admin/docs/content/contributing.md b/packages/admin/docs/content/contributing.md
new file mode 100644
index 000000000..1eb69bf5c
--- /dev/null
+++ b/packages/admin/docs/content/contributing.md
@@ -0,0 +1,34 @@
+# Contribution Guide
+
+Contributions are accepted via Pull Requests on [Github](https://github.com/shopperlabs/framework).
+
+## Bug Reports
+To encourage active collaboration, Shopper strongly encourages pull requests, not just bug reports. "Bug reports" may also be sent in the form of a pull request containing a failing test.
+
+## Pull Requests
+- **Document any change in behaviour** - Make sure the `readme.md` and any other relevant documentation are kept up-to-date.
+
+- **Consider our release cycle** - We try to follow [SemVer v2.0.0](http://semver.org/).
+
+- **One pull request per feature** - If you want to do more than one thing, send multiple pull requests.
+
+- **Send coherent history** - Make sure each individual commit in your pull request is meaningful. If you had to make multiple intermediate commits while developing, please [squash them](http://www.git-scm.com/book/en/v2/Git-Tools-Rewriting-History#Changing-Multiple-Commit-Messages) before submitting.
+
+**Happy coding**!
+
+## Security Vulnerabilities
+If you discover a security vulnerability within Laravel, please send an email to the Shopper Team at [arthur@shopperlabs.io](mailto:arthur@shopperlabs.io). All security vulnerabilities will be promptly addressed.
+
+## Coding Style
+Laravel follows the [PSR-2](https://github.com/php-fig/fig-standards/blob/master/accepted/PSR-2-coding-style-guide.md) coding standard and the [PSR-4](https://github.com/php-fig/fig-standards/blob/master/accepted/PSR-4-autoloader.md) autoloading standard.
+
+## Code of Conduct
+As contributors and maintainers of this project, we pledge to respect all people who contribute through reporting issues, posting feature requests, updating documentation, submitting pull requests or patches, and other activities.
+
+We are committed to making participation in this project a harassment-free experience for everyone, regardless of the level of experience, gender, gender identity and expression, sexual orientation, disability, personal appearance, body size, race, age, or religion.
+
+Examples of unacceptable behavior by participants include the use of sexual language or imagery, derogatory comments or personal attacks, trolling, public or private harassment, insults, or other unprofessional conduct.
+
+Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct. Project maintainers who do not follow the Code of Conduct may be removed from the project team.
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by opening an issue or contacting one or more of the project maintainers.
diff --git a/packages/admin/docs/content/customers.md b/packages/admin/docs/content/customers.md
new file mode 100644
index 000000000..8d0190d7a
--- /dev/null
+++ b/packages/admin/docs/content/customers.md
@@ -0,0 +1,129 @@
+# Customers
+In e-commerce stores, customers are one if not the fundamental point for the functioning of your store.
+
+The first page under the "Customers" menu gives you a list of all the registered users on your shop.
+
+
+
+
Customers
+
+
+During the [installation](/installing#update-existing-files) of Shopper, one of the first things required is to inherit to our model User the features of the model User that is in Shopper.
+
+## Fields
+The model used is `App\Models\User` which extends the `\Shopper\Framework\Models\User\User` model.
+
+:::warning
+During the installation of Shopper, the `name` column of the users table is removed and replaced by 2 new fields which are `first_name` and `last_name`.
+:::
+
+| Name | Type | Required | Notes |
+|-------------|-----------|------------|------------|
+| `id` | autoinc | | auto |
+| `first_name` | string | no | Nullable |
+| `last_name` | string | yes | |
+| `email` | string | yes | Unique |
+| `password` | string | no | Nullable |
+| `email_verified_at` | timestamp | no | Nullable |
+| `gender` | enum | yes | values `['male', 'female']` |
+| `phone_number` | string | no | Nullable |
+| `birth_date` | date | no | Nullable |
+| `avatar_type` | string | no | default [ui-avatars](https://ui-avatars.com/) |
+| `avatar_location` | string | no | Nullable, picture filename |
+| `timezone` | string | no | Nullable |
+| `opt_in` | boolean | no | default `false`, this field is for mailing subcription |
+| `last_login_at` | timestamp | no | Nullable |
+| `last_login_ip` | string | no | Nullable |
+
+## Components
+The components used to manage customers are found in the component configuration file `config/shopper/components.php`.
+
+```php
+use Shopper\Framework\Http\Livewire;
+
+return [
+
+ 'livewire' => [
+ 'modals.delete-customer' => Livewire\Modals\DeleteCustomer::class,
+
+ 'customers.addresses' => Livewire\Customers\Addresses::class,
+ 'customers.browse' => Livewire\Customers\Browse::class,
+ 'customers.create' => Livewire\Customers\Create::class,
+ 'customers.orders' => Livewire\Customers\Orders::class,
+ 'customers.profile' => Livewire\Customers\Profile::class,
+ 'customers.show' => Livewire\Customers\Show::class,
+
+ 'tables.customers-table' => Livewire\Tables\CustomersTable::class,
+ ];
+
+];
+```
+
+## Manage Customers
+When a new customer places an order with your store, their name and information are automatically added to your customer list. A customer profile is created when a customer interacts with your store.
+
+Alternatively, you can add a customer to your store manually.
+
+### Create customer
+From your Shopper admin, go to Customers and click on "Add customer" button.
+
+
+
+
Create customer
+
+
+When creating a customer manually, you should also fill in an address that will be used when he places an order in your store.
+
+
+
+
Customer address form
+
+
+_Optional_: If the customer has agreed to receive marketing emails, and you have entered an email address, then in the Customer overview section, check Customer agreed to receive marketing emails.
+
+And you can also check the **Send customer credentials** checkbox to sent an email to the customer with their login information.
+
+
+
+
Customer notifications
+
+
+The Livewire component used to create a client is `Shopper\Framework\Http\Livewire\Customers\Create`
+
+```php
+$customer = (new UserRepository())->create([
+ 'last_name' => $this->last_name,
+ 'first_name' => $this->first_name,
+ 'email' => $this->email,
+ 'password' => Hash::make($this->password),
+ 'phone_number' => $this->phone_number,
+ 'email_verified_at' => now()->toDateTimeString(),
+ 'opt_in' => $this->opt_in,
+]);
+
+$customer->assignRole(config('shopper.system.users.default_role'));
+```
+
+:::info
+The clients that are displayed in the listing page are those that have the `user` profile which is the default role associated with all clients.
+:::
+
+### Customer's Information
+
+In the case where you would like to have more information on a given customer, you can click on the customer name row in the customer's list. A new page appears.
+
+
+
+
Customer informations
+
+
+And in this page you can modify the information of a customer by clicking on the "update" button on the right of each information.
+
+The various sections provide you with some key data on the user:
+- **Customer information**, first and last name, e-mail address, picture, birth date, gender.
+- Registered **Addresses**
+- **Orders** Summary of purchases already made by the customer. Amount spent, payment type, order status. For more information on each order, click on the order number.
+
+:::tip
+Each of its pages are accessible via Livewire components, and are fully customizable to your needs. So don't hesitate to modify them.
+:::
diff --git a/packages/admin/docs/content/customization.md b/packages/admin/docs/content/customization.md
new file mode 100644
index 000000000..3f8e7ea78
--- /dev/null
+++ b/packages/admin/docs/content/customization.md
@@ -0,0 +1,190 @@
+# Customization
+
+Once you have installed Shopper, you need to set up a store to serve as your first location. After creating a new user, you need to login via the url `/shopper/login`. After logging in you need to fill in the required information to access the Laravel Shopper dashboard
+
+
+
+
Store customization
+
+
+Defines your shop’s address country and state, where you are based as a seller. It determines default tax rates and customer locations.
+
+## Global
+All thoses informations is stored using the **Setting** Model which is located `\Shopper\Core\Models\Setting`
+
+```php
+namespace Shopper\Core\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class Setting extends Model
+{
+ /**
+ * The attributes that are mass assignable.
+ *
+ * @var array
+ */
+ protected $fillable = [
+ 'display_name',
+ 'key',
+ 'value',
+ 'locked',
+ ];
+}
+```
+
+### Fields
+
+| Name | Type | Notes |
+|--------------|-----------|------------|
+| `id` | autoinc | |
+| `key` | string | Unique, the configuration key that will be used to retrieve this information. |
+| `display_name` | string | Nullable, represents the display name for the key that has been set for better reading|
+| `value` | json | Nullable, represents the value of the key that will be displayed when the parameter is requested |
+| `locked` | boolean | default is false (0), allows to define if this parameter can be updated |
+
+### Component
+Shopper is made of several Livewire components, to make the configuration easier and more adaptable to any kind of system.
+
+The component used to manage the configuration and customization of the store is found in the component configuration file `config/shopper/components.php`.
+
+So you can replace it and configure your store the way you want. Yes it's magic 🎩
+
+### Retrieving setting
+By default to retrieve the value of a key you can use the helper function `shopper_setting()` passing the desired key as parameter
+
+```php
+shopper_setting('my_key')
+```
+
+This value is cached for one day and under the key `shopper-setting-{$key}`
+
+## Store
+When you launch your store the first important thing to do is to fill in the information about this store.
+
+Your customers and the different services you might use need to know the information about your store.
+
+
+
+
Store information
+
+
+The information stored in this section is available using the following keys: `shop_name` for the store name, `shop_email` for the email and `shop_country_id` for the Country.
+
+## Currency
+Choose the default currency for the store. Only one may be selected.
+
+
+
+
Store currency
+
+
+For currency configurations we use the [moneyphp/money](https://github.com/moneyphp/money) package. At the moment, the formatter does it automatically depending on the currency.
+
+As you may have noticed in the code, there is also a helper that returns the currency you registered `shopper_currency()`. This will return the currency configured in your admin panel: **USD**, **XAF**, **EUR**, etc
+
+## Location
+Most stores keep their products in different locations around the world. When setting up this configuration you need to define a location that will be set as the default location for your products.
+
+When shipping an order, the products to be delivered/shipped will start from this location and thus the shipping price can be set according to this.
+
+
+
+
Store location address
+
+
+You must fill in the address of your location. You can specify GPS coordinates if you want customers to be able to geolocate you on a map with this information.
+
+Laravel Shopper uses mapbox to display this map. To configure your map you can go to the [mapbox documentation](https://docs.mapbox.com/mapbox-gl-js/api/).
+
+
+
+
Store with enable mapbox
+
+
+The keys registered in the database during this section: `shop_street_address`, `shop_zipcode`, `shop_city`, `shop_phone_number`, `shop_lng` and `shop_lat`.
+
+:::warning
+If you modify the Livewire component that takes care of registering those information you can also decide to change the name of its keys.
+:::
+
+## Channel
+In today's E-commerce the shop site is no longer the only point of sale.
+
+Channels represent a single sales channel, which can be one of the following things:
+
+- Website
+- Mobile application
+- Cashier in your physical store
+- Facebook shop,
+- Instagram shop,
+- etc
+
+or pretty much anything similar you can imagine.
+
+By default when you set up your store Shopper creates a sales channel at the same time as your first location with the same location information.
+
+```php
+(new ChannelRepository())->create([
+ 'name' => $name = __('Web Store'),
+ 'slug' => $name,
+ 'url' => env('APP_URL'),
+ 'is_default' => true,
+]);
+```
+
+This sales channel will be automatically assigned to all products that are added to your site. The implementation of a sales channel management will be done later
+
+## Social Links
+If you want your customers to find you easily on social networks, you can fill in all the links directly by putting the full url.
+
+This step is completely optional
+
+
+
+
Store social links
+
+
+The keys registered in the database during this section: `shop_facebook_link`, `shop_instagram_link` and `shop_twitter_link`.
+
+## Update setting
+You can update your store information when needed, edit your store images, update the complete address, the legal name of your shop, etc.
+
+Laravel Shopper at the moment doesn't manage several currencies so you must select with what currency you will sell on your site.
+
+To edit your shop information, you must:
+
+- From your administration, on the blue sidebar click on the settings icon at the bottom of the page **Settings > General**
+
+
+
+
Admin setting
+
+
+The component used to update store setting of the store is found in the component configuration file `config/shopper/components.php`, It's the `Shopper\Framework\Http\Livewire\Settings\General` component.
+
+```php
+use Shopper\Http\Livewire\Components;
+
+return [
+ 'livewire' => [
+
+ 'settings.inventories.create' => Components\Settings\Inventories\Create::class,
+ 'settings.inventories.edit' => Components\Settings\Inventories\Edit::class,
+ 'settings.general' => Components\Settings\General::class, // [tl! focus]
+ 'settings.legal.privacy' => Components\Settings\Legal\Privacy::class,
+ 'settings.legal.refund' => Components\Settings\Legal\Refund::class,
+
+ ];
+
+];
+```
+
+
+
+
Admin update setting
+
+
+In this interface you will update your store. Don't forget that the model used is the model `Shopper\Models\Setting`.
+
+With the Shopper configuration you can completely change the architecture of this view and the data stored in the database.
diff --git a/packages/admin/docs/content/dashboard.md b/packages/admin/docs/content/dashboard.md
new file mode 100644
index 000000000..f5e3525f7
--- /dev/null
+++ b/packages/admin/docs/content/dashboard.md
@@ -0,0 +1,49 @@
+# Dashboard
+The dashboard is a user-customizable screen. One of Shopper's main goals is to enable stores to easily customize the modules.
+
+## Overview
+When you log into the control panel, you will be taken to the dashboard — a customizable screen dispatch with a Livewire component!
+
+Laravel Shopper is a free open-source e-commerce application based on the [TALL Stack](https://tallstack.dev) and aims to build an e-commerce administration using only [Livewire](https://laravel-livewire.com) components.
+
+The navigation at the left contains the available panels for everyday use:
+
+
+
+
The dashboard and the Getting Started panel
+
+
+Clicking on each icon will open the panel or shows a list of available panels.
+
+## Components
+The component that displays the dashboard is quite simple, so you can easily replace it to put your own.
+
+The component used is `Shopper\Http\Livewire\Pages\Dashboard` and can also be found in the components file `config/shopper/components.php`.
+
+```php
+namespace Shopper\Http\Livewire\Pages;
+
+use Livewire\Component;
+
+class Dashboard extends Component
+{
+ public function render()
+ {
+ return view('shopper::livewire.pages.dashboard')
+ ->layout('shopper::components.layouts.app', [
+ 'title' => __('shopper::layout.sidebar.dashboard'),
+ ]);
+ }
+}
+```
+
+## Layout
+Shopper comes with a [Tailwind CSS](https://tailwindcss.com) based design and you can [extend](/extending/control-panel) the default layout for your components.
+
+``` blade
+
+ {{-- Your content here --}}
+
+```
+
+All pages that will be on the administration must have this content and extend the default layout of Shopper
diff --git a/packages/admin/docs/content/discounts.md b/packages/admin/docs/content/discounts.md
new file mode 100644
index 000000000..3729ad7f9
--- /dev/null
+++ b/packages/admin/docs/content/discounts.md
@@ -0,0 +1,4 @@
+# Discounts
+
+
+Coming Soon...
diff --git a/packages/admin/docs/content/documentation.md b/packages/admin/docs/content/documentation.md
new file mode 100644
index 000000000..3657f5e0b
--- /dev/null
+++ b/packages/admin/docs/content/documentation.md
@@ -0,0 +1,26 @@
+- ##### Prologue
+ - [Release Notes](https://github.com/shopperlabs/shopper/releases)
+ - [Upgrade Guide](/docs/{{version}}/upgrade)
+ - [Contribution Guide](/docs/{{version}}/contributing)
+- ##### Getting Started
+ - [Requirements](/docs/{{version}}/requirements)
+ - [Installation](/docs/{{version}}/installation)
+ - [Configuration](/docs/{{version}}/configuration)
+- ##### Concepts
+ - [Customization](/docs/{{version}}/customization)
+ - [Locations](/docs/{{version}}/locations)
+ - [Roles / Permissions](/docs/{{version}}/roles-permissions)
+ - [Two Factor Authenticator](/docs/{{version}}/two-factor)
+ - [Legal](/docs/{{version}}/legal)
+ - [Media](/docs/{{version}}/media)
+- ##### Control Panel
+ - [Dashboard](/docs/{{version}}/dashboard)
+ - [Brands](/docs/{{version}}/brands)
+ - [Categories](/docs/{{version}}/categories)
+ - [Collections](/docs/{{version}}/collections)
+ - [Customers](/docs/{{version}}/customers)
+ - [Products](/docs/{{version}}/products)
+ - [Attributes](/docs/{{version}}/attributes)
+ - [Reviews](/docs/{{version}}/reviews)
+ - [Discounts](/docs/{{version}}/discounts)
+ - [Orders](/docs/{{version}}/orders)
diff --git a/packages/admin/docs/content/extending/control-panel.md b/packages/admin/docs/content/extending/control-panel.md
new file mode 100644
index 000000000..388007d0b
--- /dev/null
+++ b/packages/admin/docs/content/extending/control-panel.md
@@ -0,0 +1,157 @@
+# Control Panel
+The control panel may be customized in a number of different ways. You may add new pages, menus, a stylesheet, or maybe you just want to add some arbitrary Javascript.
+
+When you need to add features to your Shopper administration, you can first set up some configurations
+
+## Adding CSS and JS assets
+Shopper can load extra stylesheets and Javascript files located in the `public/` directory.
+
+You may register assets to be loaded in the Control Panel using the `scripts` and `stylesheets` keys of the resources in the `config/shopper/admin.php` config file. This will accept a array of links.
+
+You can load the links locally or using cdn. They will be automatically loaded in the control panel
+
+``` php
+'resources' => [
+ 'stylesheets' => [
+ '/css/admin.css',
+ 'https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css',
+ ],
+ 'scripts' => [
+ 'https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js',
+ '/js/admin.js',
+ ],
+],
+```
+
+:::info
+Depending on how you will use your css and js files, the order is important
+:::
+
+These commands will make Shopper expect files at `public/css/admin.css` and `public/js/admin.js` respectively for local links.
+
+## Customize Shopper theme
+Shopper is built using Tallstack presets, but you are not limited to that because the base css file is already built for production.
+
+But if you want to customize your dashboard using Tailwind css you must first install Tailwind in your project. You can read the [documentation](https://tailwindcss.com/docs/guides/laravel)
+
+Shopper using Tailwind CSS, there are some Tailwind plugins you need to install first: Plugin Forms and Typography, Autoprefixer. You can install them via NPM or Yarn:
+
+```bash
+yarn add -D tailwindcss @tailwindcss/forms @tailwindcss/typography autoprefixer
+```
+
+After installing Tailwind, you need to create a `tailwind.config.js` file at the root of your project and add this content
+
+```js
+import forms from '@tailwindcss/forms'
+import typography from '@tailwindcss/typography'
+import colors from 'tailwindcss/colors'
+import filamentPreset from './vendor/filament/support/tailwind.config.preset' // [tl! focus]
+import preset from './vendor/shopper/framework/tailwind.config.preset' // [tl! focus]
+
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+ darkMode: 'class',
+ presets: [filamentPreset, preset],
+ content: [
+ './resources/**/*.blade.php',
+ './vendor/shopper/framework/**/*.blade.php', // [tl! focus:start]
+ './vendor/shopper/framework/src/**/*.php',
+ './vendor/filament/**/*.blade.php', // [tl! focus:end]
+ ],
+ theme: {
+ extends: {
+ colors: {
+ primary: colors.blue, // [tl! focus]
+ }
+ }
+ },
+ plugins: [forms, typography], // [tl! focus]
+}
+```
+
+New versions of Laravel come with vite by default so if you want to customize the Shopper admin, you need to switch to `Laravel Mix` and in your `webpack.mix.js` file, register Tailwind CSS as a PostCSS plugin:
+
+```js
+const mix = require('laravel-mix')
+
+mix.postCss('resources/css/admin.css', 'public/css', [
+ require('tailwindcss'), // [tl! focus]
+])
+```
+
+Just load the default Tailwind CSS directives inside your `./resources/css/admin.css`
+
+```css
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+```
+
+Then run `yarn run dev`
+
+:::tip
+Keep in mind the `admin.css` file must be load on the `resources` key of your `shopper/admin.php` config file
+:::
+
+And add Tailwind to the `postcss.config.js` file:
+
+```js
+module.export = {
+ plugins: {
+ tailwindcss: {},
+ autoprefixer: {},
+ },
+}
+```
+
+### Branding Logo
+After update (or not) the colors of your administration theme to reflect your brand. You'll probably want to change the logo to display
+
+By default, Laravel Shopper logo is used next to your application name in the administration panel.
+
+You can choose between 2 options
+
+The first, and simplest, is to modify the value of the `brand` key in your `shopper/admin.php` configuration file, by entering the link to your logo.
+
+```php
+ /*
+ |--------------------------------------------------------------------------
+ | Admin Brand Name
+ |--------------------------------------------------------------------------
+ |
+ | This will be displayed on the login page and in the sidebar's header.
+ |
+ */
+
+ 'brand' => 'img/logo.svg',
+```
+
+This will load using the Laravel `asset()` helper function.
+
+The 2nd option is to create a resources/views/vendor/shopper/components/brand.blade.php file to provide a customized logo:
+
+:::info
+It can be a simple svg or an image tag.
+:::
+
+```html
+
+```
+
+## Adding control panel routes
+If you need to have custom routes for the control panel:
+
+1. Create a routes file. Name it whatever you want, for example: `routes/shopper.php`
+2. Then add this to your `shopper/routes.php` file so that all routes are dynamically loaded:
+ ```php
+ 'custom_file' => base_path('routes/shopper.php'),
+ ```
+3. If you want to add middleware to further control access to the routes available in this file you can add in the key `middleware` of the `shopper/routes.php` file
+
+ ```php
+ 'middleware' => [
+ 'my-custom-middleware',
+ 'permission:can-access',
+ ],
+ ```
diff --git a/packages/admin/docs/content/extending/documentation.md b/packages/admin/docs/content/extending/documentation.md
new file mode 100644
index 000000000..61c22fe9a
--- /dev/null
+++ b/packages/admin/docs/content/extending/documentation.md
@@ -0,0 +1,6 @@
+- ##### Admin Panel
+ - [Overview](/docs/{{version}}/control-panel)
+ - [Navigation](/docs/{{version}}/navigation)
+- ##### Components
+ - [Forms](/docs/{{version}}/forms)
+ - [Modals](/docs/{{version}}/modals)
diff --git a/packages/admin/docs/content/extending/forms.md b/packages/admin/docs/content/extending/forms.md
new file mode 100644
index 000000000..33598eacd
--- /dev/null
+++ b/packages/admin/docs/content/extending/forms.md
@@ -0,0 +1,4 @@
+# Forms
+The forms allow us to quickly create input fields for our information to be stored in the database.
+
+Coming Soon...
diff --git a/packages/admin/docs/content/extending/modals.md b/packages/admin/docs/content/extending/modals.md
new file mode 100644
index 000000000..3cf22959b
--- /dev/null
+++ b/packages/admin/docs/content/extending/modals.md
@@ -0,0 +1,3 @@
+# Modals
+
+Coming Soon...
diff --git a/packages/admin/docs/content/extending/navigation.md b/packages/admin/docs/content/extending/navigation.md
new file mode 100644
index 000000000..a52b495bf
--- /dev/null
+++ b/packages/admin/docs/content/extending/navigation.md
@@ -0,0 +1,157 @@
+# Navigation
+The Control Panel navigation is quite customizable. You can add your own sections, pages, and subpages, as well as remove and modify existing ones.
+
+The navigation is controlled by the package [maatwebsite/laravel-sidebar](https://github.com/SpartnerNL/Laravel-Sidebar). You need to create a sidebar to add your menus within the main sidebar of Shopper. You may register your sidebar like event in the `register()` method of a service provider.
+
+## Adding Navigation
+Let’s assume we’re creating a Sidebar folder under app folder, and want to add a Blog navigation item to the Content section of the navigation. To add this item, we’ll create first a `BlogSidebar` class.
+
+There is no command to create this class so you have to create it manually and it must extend from `Shopper\Framework\Sidebar\AbstractAdminSidebar`
+
+We will have an architecture similar to this one
+
+``` files theme:serendipity-light
+app/
+ Sidebar/
+ BlogSidebar.php
+```
+
+:::info
+We assume here that you have already seen how to add routes for our administration explained in this [section](/extending/control-panel#adding-control-panel-routes).
+:::
+
+Here we will assume that our `routes/shopper.php` file contains this
+
+```php
+use Illuminate\Support\Facades\Route;
+
+Route::prefix('blog')->group(function () {
+ Route::resource('posts', 'PostController')->only(['index', 'create', 'edit']);
+});
+```
+
+:::warning
+You cannot use the notation `[PostController::class, 'index']` because this will not load and will generate an error. Everything is loaded directly from the RouteServiceProvider of Shopper
+:::
+
+Our BlogSidebar will look like this
+
+```php
+namespace App\Sidebar;
+
+use Maatwebsite\Sidebar\Group;
+use Maatwebsite\Sidebar\Item;
+use Maatwebsite\Sidebar\Menu;
+use Shopper\Framework\Sidebar\AbstractAdminSidebar;
+
+class BlogSidebar extends AbstractAdminSidebar
+{
+ /**
+ * Method used to define your sidebar menu groups and items.
+ *
+ * @param Menu $menu
+ * @return Menu
+ */
+ public function extendWith(Menu $menu): Menu
+ {
+ $menu->group(__('Blog'), function (Group $group) {
+ $group->weight(22);
+ $group->authorize(true);
+
+ $group->item(__('Posts'), function (Item $item) {
+ $item->weight(2);
+ $item->authorize(true);
+ $item->route('posts.index');
+ $item->icon('
+
+ ');
+ });
+ });
+
+ return $menu;
+ }
+}
+```
+
+Now we will register our sidebar in our **AppServiceProvider** with the `register()` method
+
+```php
+namespace App\Providers;
+
+use App\Sidebar\BlogSidebar; // [tl! focus]
+use Darryldecode\Cart\Cart;
+use Illuminate\Support\ServiceProvider;
+use Illuminate\Support\Str;
+use Shopper\Framework\Events\BuildingSidebar; // [tl! focus]
+
+class AppServiceProvider extends ServiceProvider
+{
+ /**
+ * Register any application services.
+ *
+ * @return void
+ */
+ public function register()
+ {
+ if ($this->app->isLocal()) {
+ $this->app->register(\Barryvdh\LaravelIdeHelper\IdeHelperServiceProvider::class);
+ }
+
+ $this->app['events']->listen(BuildingSidebar::class, BlogSidebar::class); // [tl! focus]
+
+ $this->app->singleton('wishlist', function ($app) {
+ $storage = $app['session'];
+ $events = $app['events'];
+ $instanceName = 'cart_2';
+
+ return new Cart(
+ $storage,
+ $events,
+ $instanceName,
+ session()->getId(),
+ config('shopping_cart')
+ );
+ });
+ }
+
+ /**
+ * Bootstrap any application services.
+ *
+ * @return void
+ */
+ public function boot()
+ {
+ Str::macro('readDuration', function (...$text) {
+ $totalWords = str_word_count(implode(' ', $text));
+ $minutesToRead = round($totalWords / 200);
+
+ return (int) max(1, $minutesToRead);
+ });
+ }
+}
+```
+
+We will have this in our sidebar
+
+
+
+
Blog sidebar
+
+
+## The Menu & Item Class
+Each item you see in the navigation is an instance of the `Maatwebsite\Sidebar\Item` class. Each top-level `Menu` in a section can contain its own group of `Item` children.
+
+### Basic API
+The code examples above demonstrate how to add Navigation. Once you have a `Item` object, the following chainable methods are available to you:
+
+| Method | Parameters | Description |
+| :--- | :--- | :--- |
+| `group()` | `$name` (string) | Define group name. |
+| `name()` | `$name` (string) | Define item name to overwrite the `group()` name value. |
+| `weight()` | `$weight` (int) | Define item order name. |
+| `route()` | `$name` (string) | Define a route automatically available in `routes/shopper.php` |
+| `url()` | `$url` (string) | Define a URL instead of a route. A string without a leading slash will be relative from the CP. A leading slash will be relative from the root. You may provide an absolute URL. |
+| `icon()` | `$icon` (string) | Define icon. |
+| `authorize()` | `$ability` (boolean) | Define authorization. |
diff --git a/packages/admin/docs/content/extending/overview.md b/packages/admin/docs/content/extending/overview.md
new file mode 100644
index 000000000..8d92f49e5
--- /dev/null
+++ b/packages/admin/docs/content/extending/overview.md
@@ -0,0 +1,38 @@
+# Extending Shopper
+Although Shopper is primarily designed for e-commerce sites and has many associated features, you are free to add or modify existing ones.
+
+## Why extends Shopper
+One might ask, knowing that the purpose of setting up an e-commerce site is simply to make the whole system work without always wanting to add to it.
+
+For example if you want a blog on your store, a section for a KYC, or maybe a forum, instead of creating another project to manage this you can directly extend Shopper to manage all this in the same administration area.
+
+## How to extend Shopper
+To add new features to Shopper, the first thing you need to do is to register a new element in the sidebar by creating an event (for example `RegisterCustomMenu`) and load it directly into your `AppServiceProvider` like this
+
+```php
+namespace App\Providers;
+
+use Shopper\Framework\Events\BuildingSidebar; // [tl! focus]
+
+class AppServiceProvider extends ServiceProvider
+{
+ public function registerCustomShopperSidebar() // [tl! focus]
+ { // [tl! focus]
+ $this->app['events']->listen(BuildingSidebar::class, RegisterCustomMenu::class); // [tl! focus]
+ } // [tl! focus]
+}
+```
+
+The rest of the configuration will be done using the configuration files in the `config/shopper/` folder
+
+- `/routes.php` for the routes that should be dynamically loaded for the admin panel
+- `/system.php` for the controllers that should be loaded for each route.
+
+We will deal with all this in more detail later.
+
+## How not to extend Shopper
+It should go without saying — but we'll say it anyway just in case...
+
+Don't ever, for any reason, ever, no matter what, no matter where, or who, or who you are with, or where you are going or... or where you've been... ever, for any reason, whatsoever, edit the files inside `/vendor/shopper`. Or any other Composer package. Anything you do will get blown away and you'll lose those changes forever and ever amen.
+
+You should instead build addons, extensions, and submit pull requests to [core](https://github.com/shopperlabs/shopper) (after checking with the team first if we'll accept them). Thanks!
diff --git a/packages/admin/docs/content/installation.md b/packages/admin/docs/content/installation.md
new file mode 100644
index 000000000..42b6d98ee
--- /dev/null
+++ b/packages/admin/docs/content/installation.md
@@ -0,0 +1,83 @@
+# Installation
+Quick start guide for installing and configuring Laravel Shopper on your existing Laravel App
+
+## Supported Versions of Laravel
+**Laravel 8 and Laravel 9 are supported.** It feels like this section needs more than one sentence but it really doesn't. That first one said all that needs saying.
+
+## Install Shopper
+Shopper is really easy to install. After creating your new app or in an existing Laravel app \(8+\). There are 2 steps to follow to install Shopper.
+
+1. Run `php artisan config:clear` to make sure your config isn't cached.
+2. Install `shopper/framework` with Composer.
+ ``` bash
+ composer require shopper/framework --with-dependencies
+ ```
+
+## Write Env Variables
+Next make sure to create a new database and add your database credentials to your .env file, you will also want to add your application URL in the `APP_URL` variable
+```bash
+APP_URL=http://laravelshopper.test
+DB_HOST=localhost
+DB_DATABASE=homestead
+DB_USERNAME=homestead
+DB_PASSWORD=secret
+```
+
+## Automatic Installation
+After installing Shopper in your project via compose and configuring the database, now we will automatically install in the project.
+```bash
+ php artisan shopper:install
+```
+
+This will install shopper, publish vendor files, create shopper and storage symlinks if they don't exist in the public folder, run migrations and seeders classes.
+
+And we're all good to go!
+
+## Update Existing Files
+Extend your current User Model \(usually `app/Models/User.php`\) using the `Shopper\Framework\Models\User\User as Authenticatable` alias:
+
+```php
+// app/Models/User.php
+
+use Shopper\Framework\Models\User\User as Authenticatable;
+
+class User extends Authenticatable
+{
+ // ...
+}
+```
+
+## Create an Admin user
+Now we can create a new superuser and sign into the Dashboard and start creating some content to display on the frontend.
+
+Run the following command to create a user with supreme \(at the moment of creation\) rights:
+```bash
+php artisan shopper:admin
+```
+
+And you will be prompted for the user email, firstname, lastname and password. You can now login to start create products
+
+
+
+
+
+## New Shopper Directory
+After Shopper is installed, you'll have 1 new directory in your project:
+- `config/shopper/`
+
+## Publish Vendor Files
+If you want to publish again Shopper's vendor files run these commands:
+
+```bash
+php artisan shopper:publish
+```
+
+To run the project you may use the built-in server: `php artisan serve`
+
+After that, run `composer dump-autoload` to finish your installation!
+
+If your are using Laravel Valet you can easily access with your project name with `.test` at the end when you navigate on you project.
+
+```bash
+http://laravelshopper.test/shopper/login
+```
diff --git a/packages/admin/docs/content/legal.md b/packages/admin/docs/content/legal.md
new file mode 100644
index 000000000..a42bbeae3
--- /dev/null
+++ b/packages/admin/docs/content/legal.md
@@ -0,0 +1,158 @@
+# Legal
+
+As with any e-commerce site, it is important for users to know the terms and conditions and privacy policy that your site offers. This is for their own safety and yours as well.
+
+This section allows you to set up your pages for your privacy policy, return policy, terms of use and shipping policy to be presented to customers.
+
+## Fields
+The model used is `Shopper\Core\Models\Legal`.
+
+| Name | Type | Required | Notes |
+|--------------|-----------|------------|------------|
+| `id` | autoinc | | auto |
+| `title` | string | yes | Unique, title of the legal page |
+| `slug` | string | yes | Unique, this is dynamically generated based on the title |
+| `content`| longText | no | nullable, the text of the legal page |
+| `is_enabled` | boolean | no | Default `false`, define if this legal page is ready to use|
+
+## Components
+The components used to manage Legal page are found in the component configuration file `config/shopper/components.php`. Each component corresponds to the page that is defined
+
+```php
+use Shopper\Http\Livewire\Components;
+
+return [
+ 'livewire' => [
+
+ 'settings.legal.privacy' => Components\Settings\Legal\Privacy::class,
+ 'settings.legal.refund' => Components\Settings\Legal\Refund::class,
+ 'settings.legal.shipping' => Components\Settings\Legal\Shipping::class,
+ 'settings.legal.terms' => Components\Settings\Legal\Terms::class,
+
+ ];
+
+];
+```
+
+## Add Legal content
+In your administration area you must click on the "cog" icon to display the settings page of your store.
+
+- From your admin panel, on the blue sidebar click on the cog icon, go to `Settings > Legal`.
+
+
+
+
Settings > Legal
+
+
+Once in this page, all the legal pages are displayed as a tab. You can just fill in the content of each page and click on the Enable switch to retrieve the content of your page and display it in your front-end.
+
+
+
+
Legal pages
+
+
+:::warning
+Shopper does not generate the routes for the legal pages, you should set them up yourself. As mentioned in the introduction of this documentation, the **Framework** is just an e-commerce administration
+:::
+
+## Retrieve Data
+Once the information is filled in, we can display it to our users in the views we have created.
+
+To do this we will start by creating a controller that will take care of collecting our information and send it to a view
+
+```bash
+php artisan make:controller LegalController
+```
+
+We will add the functions for each of our pages and return the information to present them to our users. Our controller will look like this
+
+```php
+namespace App\Http\Controllers;
+
+use Shopper\Core\Models\Legal;
+
+class LegalController extends Controller
+{
+ public function privacy()
+ {
+ return view('legal.privacy', [
+ 'legal' => Legal::enabled()->where('slug', 'privacy-policy')->first(),
+ ]);
+ }
+
+ public function refund()
+ {
+ return view('legal.refund', [
+ 'legal' => Legal::enabled()->where('slug', 'refund-policy')->first(),
+ ]);
+ }
+
+ public function terms()
+ {
+ return view('legal.terms', [
+ 'legal' => Legal::enabled()->where('slug', 'terms-of-use')->first(),
+ ]);
+ }
+
+ public function shipping()
+ {
+ return view('legal.shipping', [
+ 'legal' => Legal::enabled()->where('slug', 'shipping-policy')->first(),
+ ]);
+ }
+}
+```
+
+`Legal::enabled()` is a scope to retrieve the page only when it is available. This is a simple way to retrieve the pages but you can do it otherwise all the front-end code depends on you. To learn more about the scopes you can consult the [documentation](https://laravel.com/docs/10.x/eloquent#local-scopes).
+
+### Routes
+Once we have created the controllers we will associate the routes that will allow us to display our contents. We will display our content in the `web.php`.
+
+```php
+use App\Http\Controllers\LegalController;
+
+/*
+* Legal routes
+*/
+Route::get('/privacy', [LegalController::class, 'privacy'])->name('legal.privacy');
+Route::get('/terms-of-use', [LegalController::class, 'terms'])->name('legal.terms');
+Route::get('/refund-policy', [LegalController::class, 'refund'])->name('legal.refund');
+Route::get('/shipping', [LegalController::class, 'shipping'])->name('legal.shipping');
+```
+
+### Views
+You can create views in this way to arrange the content of your legal pages.
+
+``` files theme:github-light
+resources/views/legal/
+ privacy.blade.php
+ terms.blade.php
+ refund.blade.php
+ shipping.blade.php
+```
+
+:::info
+It's just an idea of how to make your views, not a recommendation. If your front-end is in react, vue or svelte you will not necessarily have the same architecture. So keep in mind that it's just to display your content.
+:::
+
+Example of a view
+
+```blade
+@extends('layouts.app')
+
+@section('body')
+
+
+
+
+ {{ __('Privacy Policy') }}
+
+ {{ __('Last update: :date', ['date' => $legal->created_at->format('d, F Y')]) }}
+
+
+ {!! $legal->content !!}
+
+
+
+@endsection
+```
diff --git a/packages/admin/docs/content/locations.md b/packages/admin/docs/content/locations.md
new file mode 100644
index 000000000..69e63767e
--- /dev/null
+++ b/packages/admin/docs/content/locations.md
@@ -0,0 +1,114 @@
+# Locations
+
+By default when you install Laravel Shopper for the first time you configure and create your shop, and this allows you to create a first location which will have the information you defined. This is the initial location in which all products will be stored.
+
+If you have already used [Shopify](https://shopify.com) it is a bit the same model, but a little simpler so that you can modify it because the system is accessible for any type of business.
+
+You can set up multiple locations in your store so that you can track inventory and have excel documents of the products ordered in each of your locations. Your locations can be retail stores, warehouses, popups, or any other place where you manage or store inventory. With multiple locations, you have better visibility into your inventory in your business.
+
+
+
+
Locations
+
+
+A location is a physical place or space where you perform any or all of the following activities: Selling products, shipping or fulfillment orders, and inventory inventory (this may even be your apartment).
+
+## Setup locations
+From the administration area of your store you can't manage more than 4 inventories. This system being still experimental we are working on it to make it simpler to facilitate the management of your store.
+
+### Fields
+The model used is `Shopper\Core\Models\Inventory`.
+
+| Name | Type | Required | Notes |
+|--------------|-----------|------------|------------|
+| `id` | autoinc | | auto |
+| `code` | string | yes | Unique, the code is a unique element that allows to index an inventory in a unique way, a bit like a slug |
+| `description`| text | no | nullable |
+| `email` | string | yes | Unique, the location email address |
+| `street_address` | string | yes | The address details (street, nr, building, etc) |
+| `street_address_plus` | string | no | The second address details (optional) |
+| `zipcode` | string | yes | National identification code. (optional) |
+| `city` | string | yes | The city/settlement |
+| `phone_number` | string | no | Nullable |
+| `priority` | integer | default (`0`) | no |
+| `latitude` | decimal | no | Nullable, GPS latitude coordinates |
+| `longitude` | decimal | no | Nullable, GPS longitude coordinates |
+| `is_default` | boolean | no | Default `false`, define location as defaut for stock|
+| `country_id` | string | yes | foreign key for country, each location must be linked to a country |
+
+### Components
+The components used to manage locations are found in the component configuration file `config/shopper/components.php`.
+
+```php
+use Shopper\Core\Http\Livewire;
+use Shopper\Core\Http\Livewire\Components;
+
+return [
+
+ 'livewire' => [
+
+ 'modals.delete-inventory' => Livewire\Modals\DeleteInventory::class, // [tl! focus]
+
+ 'settings.inventories.browse' => Components\Settings\Inventories\Browse::class, // [tl! focus]
+ 'settings.inventories.create' => Components\Settings\Inventories\Create::class,// [tl! focus]
+ 'settings.inventories.edit' => Components\Settings\Inventories\Edit::class,// [tl! focus]
+
+ ];
+
+];
+```
+
+You can expand each of its components to customize this section or replace the entire section if your system requires it.
+
+You can also change the views too and return your own views.
+
+## Manage locations
+In your administration area you must click on the "cog" icon to display the settings page of your store.
+
+- From your admin panel, on the blue sidebar click on the cog icon, go to `Settings > Locations`.
+
+
+
+
Settings > locations
+
+
+### Add location
+In your administration area you must click on the "cog" icon to display the settings page of your store.
+
+1. Click Add location.
+2. Enter a unique name and an address for the location.
+
+
+
+
Add location
+
+
+### Edit location
+To update a location you click on an available location among those you have saved and you will have the update page.
+
+
+
+
Update location
+
+
+### Define a default location
+The default location is the one in which all products will be collected with each order. If this location is empty the products will be searched in another and if it is the only one the product will be out of stock on your store.
+
+You select a location and during the modification you click on the checkbox **Set as default inventory**
+
+
+
+
Set default location
+
+
+### Delete location
+To delete a location you must click on a location to display it and at the bottom of the page you click on the delete button.
+
+
+
+
Delete location confirmation
+
+
+:::danger
+Once the location removed, all inventories will changed and this could complicate your inventory management. This is why you have a confirmation modal to be sure that this is indeed what you want to proceed.
+:::
diff --git a/packages/admin/docs/content/media.md b/packages/admin/docs/content/media.md
new file mode 100644
index 000000000..a170145ec
--- /dev/null
+++ b/packages/admin/docs/content/media.md
@@ -0,0 +1,158 @@
+# Media
+The Shopper Framework supports assigning images to products, brands, collections and categories. It is an additional layer provided by the framework with the help of the [Spatie Media Library](https://spatie.be/docs/laravel-medialibrary)
+
+We recommend organizing your images in a folder offline and keeping a backup in case you need them in the future or mistakenly alter one and wish to revert to the original. You can look at the [documentation](/configuration#update-configurations) for this purpose
+
+## Configuration
+For uploading images we are using [FilePond](https://pqina.nl/) and some custom upload component with Livewire.
+
+### Filepond
+This component is used to update media at the product level and variants for products.
+
+
+
Filepond upload
+
+
+Filepond is used in Shopper Framework only to update images, and for that it takes as parameters the images of your model.
+
+```blade
+
+```
+
+`$images` are a collection of media from the Spatie Media Library.
+
+So you have to set up the file upload in your Livewire component yourself. An example of file upload with filepond is available on Livewire you can learn more on this [link](https://www.laravel-livewire.com/screencasts/s5-integrating-with-filepond).
+
+### Single upload
+Single Upload is a reusable Livewire component created for single upload management with Livewire
+
+
+
Single upload component
+
+
+The component used is `Shopper\Http\Livewire\Components\Forms\Uploads\Single` To add it to your page you add this component to your view.
+
+```blade
+
+```
+
+Everything is done out of the box. You just add this to your Livewire component you can add a listener
+
+```php
+namespace App\Http\Livewire;
+
+use Livewire\Component;
+
+class MyComponent extends Component
+{
+ public ?string $fileUrl = null;
+
+ protected $listeners = [
+ 'shopper:fileUpdated' => 'onFileUpdate'
+ ];
+
+ public function onFileUpdate($file)
+ {
+ $this->fileUrl = $file;
+ }
+
+ public function store()
+ {
+ $model = YourModel::create([...]);
+
+ if ($this->fileUrl) {
+ $model->addMedia($this->fileUrl)
+ ->toMediaCollection(config('shopper.core.storage.collection_name'));
+ }
+ }
+}
+```
+
+:::warning
+To apply this action on your model you have to preapre your model with the Laravel Media Library [configuration](https://spatie.be/docs/laravel-medialibrary/v10/basic-usage/preparing-your-model)
+:::
+
+### Multiple upload
+The component used is `Shopper\Http\Livewire\Components\Forms\Uploads\Multiple` To add it to your page you add this component to your view.
+
+```blade
+
+```
+
+
+
+
Multiple upload component
+
+
+```php
+namespace App\Http\Livewire;
+
+use Livewire\Component;
+
+class MyComponent extends Component
+{
+ public $files = [];
+
+ protected $listeners = [
+ 'shopper:filesUpdated' => 'onFilesUpdated'
+ ];
+
+ public function onFilesUpdate($files)
+ {
+ $this->files = $files;
+ }
+
+ public function store()
+ {
+ $model = YourModel::create([...]);
+
+ if (collect($this->files)->isNotEmpty()) {
+ collect($this->files)->each(
+ fn ($file) => $model->addMedia($file)->toMediaCollection(config('shopper.core.storage.collection_name'))
+ );
+ }
+ }
+}
+```
+
+## Media Variants
+The Spatie Media library supports defining various image sizes, so-called [Conversions](https://spatie.be/docs/laravel-medialibrary/v10/converting-images/defining-conversions). The uploaded images will be then converted to the given sizes with the given parameters.
+
+For the moment in Shopper for all the Model that's used Media Library the only conversion available is
+
+```php
+public function registerMediaConversions(?Media $media = null): void
+{
+ $this->addMediaConversion('thumb200x200')
+ ->fit(Manipulations::FIT_CROP, 200, 200);
+}
+```
+
+But you can extend the different models to add conversions according to your needs.
+
+## Retrieving Images
+
+### Thumbnails
+The presence of thumbnails is a very common scenario, which is why Shopper use them.
+
+```php
+$product->getUrl('thumb200x200')
+```
+
+For more information on what's available, see [Defining conversions](https://spatie.be/docs/laravel-medialibrary/v10/converting-images/defining-conversions#content-using-multiple-conversions)
+
+### Primary
+To get an image with full url on a product, a brand or a collection
+
+```php
+$product->getFirstMediaUrl(config('shopper.core.storage.disk_name'))
+```
diff --git a/packages/admin/docs/content/orders.md b/packages/admin/docs/content/orders.md
new file mode 100644
index 000000000..17a7d60e2
--- /dev/null
+++ b/packages/admin/docs/content/orders.md
@@ -0,0 +1,4 @@
+# Orders
+
+
+Coming Soon...
diff --git a/packages/admin/docs/content/products.md b/packages/admin/docs/content/products.md
new file mode 100644
index 000000000..518b04791
--- /dev/null
+++ b/packages/admin/docs/content/products.md
@@ -0,0 +1,4 @@
+# Products
+
+
+Coming Soon...
diff --git a/packages/admin/docs/content/requirements.md b/packages/admin/docs/content/requirements.md
new file mode 100644
index 000000000..c4e26f839
--- /dev/null
+++ b/packages/admin/docs/content/requirements.md
@@ -0,0 +1,47 @@
+# Requirements
+Shopper is a modern PHP application, built as a [Laravel](https://laravel.com) package, and has the same server requirements as — you guessed it — Laravel itself. To manipulate images (resize, crop, etc), you will also need the GD Library or ImageMagick.
+
+## Server Requirements
+To run Laravel Shopper you'll need a server meeting the following requirements. These are all pretty standard in most modern hosting platforms.
+
+## PHP Version
+- PHP 8.0+
+
+## PHP Extension
+- BCMath PHP Extension
+- Ctype PHP Extension
+- Exif PHP Extension
+- JSON PHP Extension
+- Mbstring PHP Extension
+- OpenSSL PHP Extension
+- PDO PHP Extension
+- Tokenizer PHP Extension
+- XML PHP Extension
+- GD Library or ImageMagick
+
+## Database Engine
+- MySQL 8.0+
+- MariaDB 10.2+
+- PostgreSQL 9.4+
+
+## Recommended Hosts
+
+We recommend using [Digital Ocean][do] to host most Laravel sites. Their servers are fast, inexpensive, and we use them ourselves. _**Full disclosure:** that's an affiliate link but we wouldn't recommend them if it wasn't an excellent option._
+
+## Development Environments
+All of these requirements are satisfied by the [Laravel Homestead][homestead] virtual machine, which makes it a great local Laravel development environment. Virtual machines aren't for everybody though, so here are a couple of other options.
+
+### Laravel Valet (MacOS)
+[Laravel Valet][valet] is a development environment for Mac minimalists If you are on Linux you must use this [version][valet_linux] of Valet for Linux. No Vagrant, No Apache, No Nginx, No need to manually edit hosts file. It simply maps all the subdirectories in a “web” directory (such as `~/Sites`) to `.test` or `.localhost` domains.
+
+You can even share your sites publicly using local tunnels. We use it ourselves and it’s brilliant.
+
+### Laragon (Windows)
+[Laragon][laragon] and [WAMP][wamp] are both good choice for those of the Windows persuasion. You may also want to checkout [Laravel Sail](https://laravel.com/docs/8.x/sail), which works well with Statamic.
+
+[do]: https://m.do.co/c/d6dca1691fb4
+[homestead]: https://laravel.com/docs/homestead
+[valet]: https://laravel.com/docs/valet
+[valet_linux]: https://cpriego.github.io/valet-linux
+[wamp]: http://www.wampserver.com/
+[laragon]:https://laragon.org/
diff --git a/packages/admin/docs/content/reviews.md b/packages/admin/docs/content/reviews.md
new file mode 100644
index 000000000..915154974
--- /dev/null
+++ b/packages/admin/docs/content/reviews.md
@@ -0,0 +1,4 @@
+# Reviews
+
+
+Coming Soon...
diff --git a/packages/admin/docs/content/roles-permissions.md b/packages/admin/docs/content/roles-permissions.md
new file mode 100644
index 000000000..8ebac68b0
--- /dev/null
+++ b/packages/admin/docs/content/roles-permissions.md
@@ -0,0 +1,252 @@
+# Roles & Permissions
+Manage access and permissions of your users and members in your store.
+
+To connect to the dashboard you need to have the role `administrator` this role can be found in the configuration file `config/shopper/core.php`.
+
+```php
+/*
+|--------------------------------------------------------------------------
+| Configurations for the user
+|--------------------------------------------------------------------------
+|
+| User configuration to manage user access using spatie/laravel-permission.
+|
+*/
+
+'users' => [
+ 'admin_role' => 'administrator', // [tl! highlight]
+ 'default_role' => 'user',
+],
+```
+
+After [creating an super admin](/installing#create-an-admin-user) we get the following result
+
+```bash
+php artisan shopper:admin
+
+Create Admin User for Shopper administration panel
+
+ Email Address [admin@admin.com]:
+ > arthur@shopperlabs.io
+
+ First Name [Shopper]:
+ >
+
+ Last Name [Admin]:
+ >
+
+ Password:
+ >
+
+ Confirm Password:
+ >
+
+Creating admin account...
+User created successfully.
+```
+
+After logged as an admin, you can add members with permissions on your staff to log in to your store and complete tasks like **adding products** or managing **orders** and use roles to control what sections of your store they can access.
+
+Permissions help you manage what your store’s staff can do in your admin. Roles let you delegate, and assign the level of access that your staff needs to do their jobs effectively.
+
+Permissions are associated with roles. Depending on the role that a member has, you can assign different types of permissions to it to limit or increase the actions they can do.
+
+All this management of roles and permissions is done using the [Laravel Permission](https://github.com/spatie/laravel-permission) package from [Spatie](https://spatie.be).
+
+At installation Laravel Shopper comes with 3 roles: **Administrator**, **Manager** and **User**, the user role cannot be modified from the administration interface because it is the role that will be assigned to any customer who will create his account on your shop.
+
+## RBAC ACL
+RBAC (Role Based Access Control) or ACL (Access Control Layer) is an approach to restricting system access for users using roles system, Laravel Shopper allow to define the level of access for each user. With roles a user can access menus, pages. It is important to know that one Administrator can have multiple roles assigned.
+
+To view the roles and permissions management page, you must go to the `Settings > Staff & Permissions`
+
+
+
+
Settings > Staff & permissions
+
+
+### Fields
+The model used for the **Role** is `Shopper\Core\Models\Role` this model extend from the Spatie Role model.
+
+| Name | Type | Required | Notes |
+|-------------|-----------|----------|------------|
+| `id` | autoinc | | auto |
+| `name` | string | yes | Role name in lowercase such as an slug (Eg.: author)|
+| `guard_name`| string | no | This field is automatically filled in by Spatie |
+| `display_name`| string | no | Nullable, the readable name for the role (Eg.: Blog Author)|
+| `description`| text | no | Nullable, the role description |
+| `can_be_removed` | boolean | no | Default `true`, defines if a role can be deleted. Initially no role that comes with Shopper can be deleted from the interface. But the roles that will be added afterwards can be deleted.|
+
+And the **Permission** model is `Shopper\Core\Models\Permission`
+
+| Name | Type | Required | Notes |
+|-------------|-----------|----------|------------|
+| `id` | autoinc | | auto |
+| `name` | string | yes | Permission name in lowercase such as an slug (Eg.: create_post)|
+| `guard_name`| string | no | This field is automatically filled in by Spatie |
+| `group_name`| string | no | Permissions can be grouped into groups to better organize them. The basic permissions that come with Shopper are mostly grouped together. |
+| `display_name`| string | no | Nullable, the readable name for the permission (Eg.: Create Post)|
+| `description`| text | no | Nullable, the permission description |
+| `can_be_removed` | boolean | no | Default `true`, defines if a permission can be deleted. Initially no permission that comes with Shopper can be deleted from the interface. But the permissions that will be added afterwards can be deleted.|
+
+The **Permission** model has some groups as shown here
+
+```php
+namespace Shopper\Framework\Models\User;
+
+use Spatie\Permission\Models\Permission as SpatiePermission;
+
+class Permission extends SpatiePermission
+{
+ /**
+ * Get a lists of permissions groups.
+ */
+ public static function groups(): array
+ {
+ return [
+ 'system' => __('System'),
+ 'brands' => __('Brands'),
+ 'categories' => __('Categories'),
+ 'collections' => __('Collections'),
+ 'products' => __('Products'),
+ 'customers' => __('Customers'),
+ 'orders' => __('Orders'),
+ 'discounts' => __('Discounts'),
+ ];
+ }
+}
+```
+
+### Components
+The components used to manage locations are found in the component configuration file `config/shopper/components.php`.
+
+```php
+use Shopper\Framework\Http\Livewire;
+use Shopper\Framework\Http\Livewire\Components;
+
+return [
+
+ 'livewire' => [
+
+ 'modals.delete-role' => Livewire\Modals\DeleteRole::class,
+ 'modals.create-permission' => Livewire\Modals\CreatePermission::class,
+ 'modals.create-role' => Livewire\Modals\CreateRole::class,
+
+ 'settings.management.create-admin-user' => Components\Settings\Management\CreateAdminUser::class,
+ 'settings.management.management' => Components\Settings\Management\Management::class,
+ 'settings.management.permissions' => Components\Settings\Management\Permissions::class,
+ 'settings.management.role' => Components\Settings\Management\Role::class,
+ 'settings.management.users-role' => Components\Settings\Management\UsersRole::class,
+
+ ];
+
+];
+```
+
+## Manage Roles
+A Role is a set of permissions to perform certain operations within the system, which is assigned to a chosen Administrator. As said previously Laravel Shopper at installation comes with 3 roles but 2 are accessible in the administration panel.
+
+The user role does not appear, modifying it could lead to bugs on your store so it is not listed here.
+
+
+
+
Roles & Admins
+
+
+:::warning
+It's **strongly** advised to not change the name of roles when they are already assigned to users. If the role verification is done manually you will be forced to change this name in all **middleware**, **helpers**, **blade directives** etc.
+:::
+
+### Add role
+To add a new role, you must click on `Add a new role` button. Required fields are marked with asterisks
+
+
+
+
Add new role
+
+
+The added roles can be used later in your code to assign functionality or access to resources.
+
+### Update role
+To modify a role you must click on the role you want to modify to access the edit form.
+
+And as already mentioned, all Shopper features are livewire components. So you can change everything at any time to fit your store.
+
+
+
+
Update role
+
+
+### Create admin
+In addition to creating an administrator from the command line you can also do it from the Shopper interface, you just need to click on **Add Administrator** button.
+
+
+
+
Add admin
+
+
+Then you fill in the information of your administrator with the role chosen for him
+
+
+
+
Add admin form
+
+
+The actual role registration function looks like the code below. And the whole implementation class is `Shopper\Http\Livewire\Components\Settings\Management\CreateAdminUser`
+
+```php
+public function store()
+{
+ $this->validate($this->rules(), $this->messages());
+
+ $user = (new UserRepository())->create([
+ 'email' => $this->email,
+ 'first_name' => $this->first_name,
+ 'last_name' => $this->last_name,
+ 'password' => Hash::make($this->password),
+ 'phone_number' => $this->phone_number,
+ 'gender' => $this->gender,
+ 'email_verified_at' => now()->toDateTimeString(),
+ ]);
+
+ $role = Role::findById((int) $this->role_id);
+
+ $user->assignRole([$role->name]);
+
+ if ($this->send_mail) {
+ $user->notify(new AdminSendCredentials($this->password));
+ }
+
+ session()->flash('success', __('Admin :user added successfully.', ['user' => $user->full_name]));
+
+ $this->redirectRoute('shopper.settings.users');
+}
+```
+
+### Create permission
+Let’s assume that you would like to add a new permission to ACL. You will need to choose the role because every single permissions are linked to a role.
+
+In the way that when a admin are granted of a specific role, he take all role's permissions.
+
+
+
+
Role's permissions example
+
+
+As you may have noticed all permissions are grouped by type, and the available types are mentioned above in this [section](/roles-permissions#fields).
+
+To add a new permission you just need to click on the **Create permission** button.
+
+
+
+
Add permission
+
+
+After adding your permission it will be automatically associated with the role and therefore all administrators with this role will have this permission.
+
+If the permission has no group it will be in a `Custom permissions` section.
+
+
+
+
New permission
+
diff --git a/packages/admin/docs/content/two-factor.md b/packages/admin/docs/content/two-factor.md
new file mode 100644
index 000000000..9ba0fdae4
--- /dev/null
+++ b/packages/admin/docs/content/two-factor.md
@@ -0,0 +1,76 @@
+# Two Factor Authenticator
+Secure your account with two-step authentication
+
+Two-step authentication (also known as two-factor authentication or multifactor authentication) provides a more secure login process. When you attempt to sign in, you need to complete two separate steps:
+
+1. Enter the account password.
+2. Authenticate through a mobile app security key.
+
+These two steps will make much more difficult for an unauthorized person to access your account. Even if they are able to find your password, they will not be able to connect without the second step.
+
+Authentication in two secure steps rests on the combination of two factors, which can be something you know (such as your combination of connection and password), something you have (such as a code to Only one use provided by an authentication application or SMS) or something you are (providing biometric authentication, such as a fingerprint).
+
+Two-step authentication can be configured for all accounts, but the store owner can not activate it for staff. The staff must put it in place for his own accounts. If you have multiple employees who manage your shop.
+
+## Enabling Two-Factor Authentication
+To enable two-step authentication, you'll need first to download an authenticator app to your mobile device. The app will be able to scan QR codes and retrieve authentication data for you. Recommended authenticator apps:
+
+- [Google Authenticator](https://support.google.com/accounts/answer/1066447)
+- [Duo Mobile](https://guide.duo.com/third-party-accounts)
+- [Amazon AWS MFA](https://aws.amazon.com/iam/details/mfa)
+- [Authenticator](https://www.microsoft.com/store/p/microsoft-authenticator/9nblgggzmcj6)
+
+In addition, you should store the listed recovery codes in a secure password manager such as [1Password](https://1password.com).
+
+When you install an authenticator app, make sure that you follow its instructions carefully. After your app is successfully downloaded and set up, you can activate the feature in Shopper.
+
+From your administrator interface, click on your name with account picture in the upper right corner. Next click on **Personal Account**
+
+
+
+
Account Dropdown
+
+
+Scroll to the two factor authenticate section on the screen, click **Enable authentication**. This action will trigger a modal to ask you to confirm your password
+
+
+
+
Two factor section
+
+
+Enter your current password in the space provided and click **Enable**.
+
+If the user loses access to their mobile device, the login page will allow them to authenticate using one of their recovery codes instead of the temporary token provided by their mobile device's authenticator application.
+
+
+
+
Two factor QRcode & Recovery Code
+
+
+This feature is inspired by [Laravel Fortify](https://laravel.com/docs/9.x/fortify) which is implemented in [Laravel Jetstream](https://jetstream.laravel.com/2.x/introduction.html)
+
+Now when you try to log in, two-factor authentication will require your mobile device.
+
+## Logging in with Two-Factor Authentication
+
+You will go to the Shopper administration login page. You will enter your email address and password and click on the **Login** button. On the next page, you need to authenticate using the method you've used to set up two-factor authentication.
+
+
+
+
Two factor Login
+
+
+If you used a two-factor authentication app, open it and retrieve the code you will be given and click on the login button
+
+If you have rather copied the recovery codes in an application like 1Password you will have to recover a code, enter it to connect to your store.
+
+## Disable Two-Factor Authentication
+
+From your administrator interface, click on your name and your account photo in the upper right corner and click on Personnal Account menu.
+
+In the Two-factor authentication section, use the Disable button for the authentication method you want to deactivate. This will ask you for a password confirmation, you enter your password and click on confirm to completely deactivate the Two-factor authentication.
+
+
+
+
Two factor disable
+
diff --git a/packages/admin/docs/screenshots/account-dropdown.png b/packages/admin/docs/screenshots/account-dropdown.png
new file mode 100644
index 000000000..5651a71cd
Binary files /dev/null and b/packages/admin/docs/screenshots/account-dropdown.png differ
diff --git a/packages/admin/docs/screenshots/add-admin.png b/packages/admin/docs/screenshots/add-admin.png
new file mode 100644
index 000000000..af43d537e
Binary files /dev/null and b/packages/admin/docs/screenshots/add-admin.png differ
diff --git a/packages/admin/docs/screenshots/add-location.png b/packages/admin/docs/screenshots/add-location.png
new file mode 100644
index 000000000..3aac5c3c8
Binary files /dev/null and b/packages/admin/docs/screenshots/add-location.png differ
diff --git a/packages/admin/docs/screenshots/add-permission.png b/packages/admin/docs/screenshots/add-permission.png
new file mode 100644
index 000000000..f0f3ab6a2
Binary files /dev/null and b/packages/admin/docs/screenshots/add-permission.png differ
diff --git a/packages/admin/docs/screenshots/add-role.png b/packages/admin/docs/screenshots/add-role.png
new file mode 100644
index 000000000..71da0449c
Binary files /dev/null and b/packages/admin/docs/screenshots/add-role.png differ
diff --git a/packages/admin/docs/screenshots/attributes.png b/packages/admin/docs/screenshots/attributes.png
new file mode 100644
index 000000000..08ff0c1d4
Binary files /dev/null and b/packages/admin/docs/screenshots/attributes.png differ
diff --git a/packages/admin/docs/screenshots/auth-two-factor-authentication.png b/packages/admin/docs/screenshots/auth-two-factor-authentication.png
new file mode 100644
index 000000000..9ad8a722d
Binary files /dev/null and b/packages/admin/docs/screenshots/auth-two-factor-authentication.png differ
diff --git a/packages/admin/docs/screenshots/brand-empty-state.png b/packages/admin/docs/screenshots/brand-empty-state.png
new file mode 100644
index 000000000..065921f83
Binary files /dev/null and b/packages/admin/docs/screenshots/brand-empty-state.png differ
diff --git a/packages/admin/docs/screenshots/brand-lists.png b/packages/admin/docs/screenshots/brand-lists.png
new file mode 100644
index 000000000..379ce8fe8
Binary files /dev/null and b/packages/admin/docs/screenshots/brand-lists.png differ
diff --git a/packages/admin/docs/screenshots/categories.png b/packages/admin/docs/screenshots/categories.png
new file mode 100644
index 000000000..a071e5d23
Binary files /dev/null and b/packages/admin/docs/screenshots/categories.png differ
diff --git a/packages/admin/docs/screenshots/category-parent.png b/packages/admin/docs/screenshots/category-parent.png
new file mode 100644
index 000000000..6daa1fcaf
Binary files /dev/null and b/packages/admin/docs/screenshots/category-parent.png differ
diff --git a/packages/admin/docs/screenshots/collection-empty-state.png b/packages/admin/docs/screenshots/collection-empty-state.png
new file mode 100644
index 000000000..ebb54e482
Binary files /dev/null and b/packages/admin/docs/screenshots/collection-empty-state.png differ
diff --git a/packages/admin/docs/screenshots/collection-rules.png b/packages/admin/docs/screenshots/collection-rules.png
new file mode 100644
index 000000000..6b64d151b
Binary files /dev/null and b/packages/admin/docs/screenshots/collection-rules.png differ
diff --git a/packages/admin/docs/screenshots/collections-preview.png b/packages/admin/docs/screenshots/collections-preview.png
new file mode 100644
index 000000000..7d52bf20b
Binary files /dev/null and b/packages/admin/docs/screenshots/collections-preview.png differ
diff --git a/packages/admin/docs/screenshots/collections.png b/packages/admin/docs/screenshots/collections.png
new file mode 100644
index 000000000..cfd4982ad
Binary files /dev/null and b/packages/admin/docs/screenshots/collections.png differ
diff --git a/packages/admin/docs/screenshots/create-attribute.png b/packages/admin/docs/screenshots/create-attribute.png
new file mode 100644
index 000000000..0754b6744
Binary files /dev/null and b/packages/admin/docs/screenshots/create-attribute.png differ
diff --git a/packages/admin/docs/screenshots/create-category.png b/packages/admin/docs/screenshots/create-category.png
new file mode 100644
index 000000000..41f7b27b3
Binary files /dev/null and b/packages/admin/docs/screenshots/create-category.png differ
diff --git a/packages/admin/docs/screenshots/create-collection.png b/packages/admin/docs/screenshots/create-collection.png
new file mode 100644
index 000000000..d8ee76f99
Binary files /dev/null and b/packages/admin/docs/screenshots/create-collection.png differ
diff --git a/packages/admin/docs/screenshots/create-customer.png b/packages/admin/docs/screenshots/create-customer.png
new file mode 100644
index 000000000..cdb9087e4
Binary files /dev/null and b/packages/admin/docs/screenshots/create-customer.png differ
diff --git a/packages/admin/docs/screenshots/create-discount.png b/packages/admin/docs/screenshots/create-discount.png
new file mode 100644
index 000000000..0f0a8400c
Binary files /dev/null and b/packages/admin/docs/screenshots/create-discount.png differ
diff --git a/packages/admin/docs/screenshots/custom-permissions.png b/packages/admin/docs/screenshots/custom-permissions.png
new file mode 100644
index 000000000..9e75c2d1f
Binary files /dev/null and b/packages/admin/docs/screenshots/custom-permissions.png differ
diff --git a/packages/admin/docs/screenshots/customer-address.png b/packages/admin/docs/screenshots/customer-address.png
new file mode 100644
index 000000000..8c2ae818a
Binary files /dev/null and b/packages/admin/docs/screenshots/customer-address.png differ
diff --git a/packages/admin/docs/screenshots/customer-informations.png b/packages/admin/docs/screenshots/customer-informations.png
new file mode 100644
index 000000000..b21109142
Binary files /dev/null and b/packages/admin/docs/screenshots/customer-informations.png differ
diff --git a/packages/admin/docs/screenshots/customer-notification.png b/packages/admin/docs/screenshots/customer-notification.png
new file mode 100644
index 000000000..5b8ba19e6
Binary files /dev/null and b/packages/admin/docs/screenshots/customer-notification.png differ
diff --git a/packages/admin/docs/screenshots/customers-empty-state.png b/packages/admin/docs/screenshots/customers-empty-state.png
new file mode 100644
index 000000000..3a85b7e48
Binary files /dev/null and b/packages/admin/docs/screenshots/customers-empty-state.png differ
diff --git a/packages/admin/docs/screenshots/customers.png b/packages/admin/docs/screenshots/customers.png
new file mode 100644
index 000000000..f288cdd99
Binary files /dev/null and b/packages/admin/docs/screenshots/customers.png differ
diff --git a/packages/admin/docs/screenshots/customization-map-off.png b/packages/admin/docs/screenshots/customization-map-off.png
new file mode 100644
index 000000000..4af480b48
Binary files /dev/null and b/packages/admin/docs/screenshots/customization-map-off.png differ
diff --git a/packages/admin/docs/screenshots/customization-map.png b/packages/admin/docs/screenshots/customization-map.png
new file mode 100644
index 000000000..4df94336d
Binary files /dev/null and b/packages/admin/docs/screenshots/customization-map.png differ
diff --git a/packages/admin/docs/screenshots/customization-social-media.png b/packages/admin/docs/screenshots/customization-social-media.png
new file mode 100644
index 000000000..05269d35a
Binary files /dev/null and b/packages/admin/docs/screenshots/customization-social-media.png differ
diff --git a/packages/admin/docs/screenshots/customization.png b/packages/admin/docs/screenshots/customization.png
new file mode 100644
index 000000000..63370133c
Binary files /dev/null and b/packages/admin/docs/screenshots/customization.png differ
diff --git a/packages/admin/docs/screenshots/dashboard.png b/packages/admin/docs/screenshots/dashboard.png
new file mode 100644
index 000000000..061990850
Binary files /dev/null and b/packages/admin/docs/screenshots/dashboard.png differ
diff --git a/packages/admin/docs/screenshots/default-location.png b/packages/admin/docs/screenshots/default-location.png
new file mode 100644
index 000000000..7716c6b69
Binary files /dev/null and b/packages/admin/docs/screenshots/default-location.png differ
diff --git a/packages/admin/docs/screenshots/delete-location.png b/packages/admin/docs/screenshots/delete-location.png
new file mode 100644
index 000000000..68fd86489
Binary files /dev/null and b/packages/admin/docs/screenshots/delete-location.png differ
diff --git a/packages/admin/docs/screenshots/discounts-empty-state.png b/packages/admin/docs/screenshots/discounts-empty-state.png
new file mode 100644
index 000000000..39519cd3f
Binary files /dev/null and b/packages/admin/docs/screenshots/discounts-empty-state.png differ
diff --git a/packages/admin/docs/screenshots/filepond.png b/packages/admin/docs/screenshots/filepond.png
new file mode 100644
index 000000000..4a3d4c657
Binary files /dev/null and b/packages/admin/docs/screenshots/filepond.png differ
diff --git a/packages/admin/docs/screenshots/legal-screenshot.png b/packages/admin/docs/screenshots/legal-screenshot.png
new file mode 100644
index 000000000..4e0e6090a
Binary files /dev/null and b/packages/admin/docs/screenshots/legal-screenshot.png differ
diff --git a/packages/admin/docs/screenshots/location-admin.png b/packages/admin/docs/screenshots/location-admin.png
new file mode 100644
index 000000000..a07e29f7e
Binary files /dev/null and b/packages/admin/docs/screenshots/location-admin.png differ
diff --git a/packages/admin/docs/screenshots/login.png b/packages/admin/docs/screenshots/login.png
new file mode 100644
index 000000000..01a306415
Binary files /dev/null and b/packages/admin/docs/screenshots/login.png differ
diff --git a/packages/admin/docs/screenshots/multiple-upload.png b/packages/admin/docs/screenshots/multiple-upload.png
new file mode 100644
index 000000000..63853fe5e
Binary files /dev/null and b/packages/admin/docs/screenshots/multiple-upload.png differ
diff --git a/packages/admin/docs/screenshots/orders-empty-state.png b/packages/admin/docs/screenshots/orders-empty-state.png
new file mode 100644
index 000000000..bbf20a833
Binary files /dev/null and b/packages/admin/docs/screenshots/orders-empty-state.png differ
diff --git a/packages/admin/docs/screenshots/payment-methods.png b/packages/admin/docs/screenshots/payment-methods.png
new file mode 100644
index 000000000..59f225ec6
Binary files /dev/null and b/packages/admin/docs/screenshots/payment-methods.png differ
diff --git a/packages/admin/docs/screenshots/permissions-browse.png b/packages/admin/docs/screenshots/permissions-browse.png
new file mode 100644
index 000000000..53baf7da6
Binary files /dev/null and b/packages/admin/docs/screenshots/permissions-browse.png differ
diff --git a/packages/admin/docs/screenshots/product-attributes.png b/packages/admin/docs/screenshots/product-attributes.png
new file mode 100644
index 000000000..17e01c0c6
Binary files /dev/null and b/packages/admin/docs/screenshots/product-attributes.png differ
diff --git a/packages/admin/docs/screenshots/product-inventory.png b/packages/admin/docs/screenshots/product-inventory.png
new file mode 100644
index 000000000..b3015741f
Binary files /dev/null and b/packages/admin/docs/screenshots/product-inventory.png differ
diff --git a/packages/admin/docs/screenshots/product-pricing.png b/packages/admin/docs/screenshots/product-pricing.png
new file mode 100644
index 000000000..c00514555
Binary files /dev/null and b/packages/admin/docs/screenshots/product-pricing.png differ
diff --git a/packages/admin/docs/screenshots/product-seo.png b/packages/admin/docs/screenshots/product-seo.png
new file mode 100644
index 000000000..19c13a4d9
Binary files /dev/null and b/packages/admin/docs/screenshots/product-seo.png differ
diff --git a/packages/admin/docs/screenshots/product-shipping.png b/packages/admin/docs/screenshots/product-shipping.png
new file mode 100644
index 000000000..01709a42f
Binary files /dev/null and b/packages/admin/docs/screenshots/product-shipping.png differ
diff --git a/packages/admin/docs/screenshots/product-show-inventory.png b/packages/admin/docs/screenshots/product-show-inventory.png
new file mode 100644
index 000000000..e7ba1f639
Binary files /dev/null and b/packages/admin/docs/screenshots/product-show-inventory.png differ
diff --git a/packages/admin/docs/screenshots/product-variant.png b/packages/admin/docs/screenshots/product-variant.png
new file mode 100644
index 000000000..01530f75e
Binary files /dev/null and b/packages/admin/docs/screenshots/product-variant.png differ
diff --git a/packages/admin/docs/screenshots/products.png b/packages/admin/docs/screenshots/products.png
new file mode 100644
index 000000000..ebf30e32d
Binary files /dev/null and b/packages/admin/docs/screenshots/products.png differ
diff --git a/packages/admin/docs/screenshots/profile.png b/packages/admin/docs/screenshots/profile.png
new file mode 100644
index 000000000..bd169b1e7
Binary files /dev/null and b/packages/admin/docs/screenshots/profile.png differ
diff --git a/packages/admin/docs/screenshots/related-product.png b/packages/admin/docs/screenshots/related-product.png
new file mode 100644
index 000000000..f28df5162
Binary files /dev/null and b/packages/admin/docs/screenshots/related-product.png differ
diff --git a/packages/admin/docs/screenshots/reviews-empty-state.png b/packages/admin/docs/screenshots/reviews-empty-state.png
new file mode 100644
index 000000000..98c58ca94
Binary files /dev/null and b/packages/admin/docs/screenshots/reviews-empty-state.png differ
diff --git a/packages/admin/docs/screenshots/roles-admins.png b/packages/admin/docs/screenshots/roles-admins.png
new file mode 100644
index 000000000..e443ea07d
Binary files /dev/null and b/packages/admin/docs/screenshots/roles-admins.png differ
diff --git a/packages/admin/docs/screenshots/seo-preview.gif b/packages/admin/docs/screenshots/seo-preview.gif
new file mode 100644
index 000000000..85c9f5d20
Binary files /dev/null and b/packages/admin/docs/screenshots/seo-preview.gif differ
diff --git a/packages/admin/docs/screenshots/setting-analytics.png b/packages/admin/docs/screenshots/setting-analytics.png
new file mode 100644
index 000000000..2f063ac92
Binary files /dev/null and b/packages/admin/docs/screenshots/setting-analytics.png differ
diff --git a/packages/admin/docs/screenshots/settings.png b/packages/admin/docs/screenshots/settings.png
new file mode 100644
index 000000000..090dc2010
Binary files /dev/null and b/packages/admin/docs/screenshots/settings.png differ
diff --git a/packages/admin/docs/screenshots/single-product-screen.png b/packages/admin/docs/screenshots/single-product-screen.png
new file mode 100644
index 000000000..3bd9f4aa6
Binary files /dev/null and b/packages/admin/docs/screenshots/single-product-screen.png differ
diff --git a/packages/admin/docs/screenshots/single-upload.png b/packages/admin/docs/screenshots/single-upload.png
new file mode 100644
index 000000000..5cffc37d0
Binary files /dev/null and b/packages/admin/docs/screenshots/single-upload.png differ
diff --git a/packages/admin/docs/screenshots/store-currency.png b/packages/admin/docs/screenshots/store-currency.png
new file mode 100644
index 000000000..0fb18da12
Binary files /dev/null and b/packages/admin/docs/screenshots/store-currency.png differ
diff --git a/packages/admin/docs/screenshots/store-information.png b/packages/admin/docs/screenshots/store-information.png
new file mode 100644
index 000000000..fcd3ba3ff
Binary files /dev/null and b/packages/admin/docs/screenshots/store-information.png differ
diff --git a/packages/admin/docs/screenshots/store-setting-update.png b/packages/admin/docs/screenshots/store-setting-update.png
new file mode 100644
index 000000000..ca89a8ca2
Binary files /dev/null and b/packages/admin/docs/screenshots/store-setting-update.png differ
diff --git a/packages/admin/docs/screenshots/two-factor-code.png b/packages/admin/docs/screenshots/two-factor-code.png
new file mode 100644
index 000000000..9b569bcda
Binary files /dev/null and b/packages/admin/docs/screenshots/two-factor-code.png differ
diff --git a/packages/admin/docs/screenshots/two-factor-disable.png b/packages/admin/docs/screenshots/two-factor-disable.png
new file mode 100644
index 000000000..5ae99011a
Binary files /dev/null and b/packages/admin/docs/screenshots/two-factor-disable.png differ
diff --git a/packages/admin/docs/screenshots/two-factor-section.png b/packages/admin/docs/screenshots/two-factor-section.png
new file mode 100644
index 000000000..29c8843fb
Binary files /dev/null and b/packages/admin/docs/screenshots/two-factor-section.png differ
diff --git a/packages/admin/docs/screenshots/update-attribute.png b/packages/admin/docs/screenshots/update-attribute.png
new file mode 100644
index 000000000..90a01c9d3
Binary files /dev/null and b/packages/admin/docs/screenshots/update-attribute.png differ
diff --git a/packages/admin/docs/screenshots/update-category.png b/packages/admin/docs/screenshots/update-category.png
new file mode 100644
index 000000000..03764f00c
Binary files /dev/null and b/packages/admin/docs/screenshots/update-category.png differ
diff --git a/packages/admin/docs/screenshots/update-location.png b/packages/admin/docs/screenshots/update-location.png
new file mode 100644
index 000000000..17f5c5280
Binary files /dev/null and b/packages/admin/docs/screenshots/update-location.png differ
diff --git a/packages/admin/docs/screenshots/update-role.png b/packages/admin/docs/screenshots/update-role.png
new file mode 100644
index 000000000..3584e556a
Binary files /dev/null and b/packages/admin/docs/screenshots/update-role.png differ
diff --git a/packages/admin/tailwind.config.preset.js b/packages/admin/tailwind.config.preset.js
index b74a84d74..86ac7a4d0 100755
--- a/packages/admin/tailwind.config.preset.js
+++ b/packages/admin/tailwind.config.preset.js
@@ -14,7 +14,6 @@ export default {
content: [
'./resources/views/**/*.blade.php',
'./src/**/*.php',
- './vendor/wire-elements/modal/resources/views/*.blade.php',
],
theme: {
extend: {
diff --git a/tailwind.config.js b/tailwind.config.js
index a13f0c06f..e82978069 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -7,5 +7,6 @@ export default {
content: [
'./packages/**/*.blade.php',
'./vendor/filament/**/*.blade.php',
+ './vendor/wire-elements/modal/resources/views/*.blade.php',
],
}
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+  }}){kind=icon}
+```
+
+## Adding control panel routes
+If you need to have custom routes for the control panel:
+
+1. Create a routes file. Name it whatever you want, for example: `routes/shopper.php`
+2. Then add this to your `shopper/routes.php` file so that all routes are dynamically loaded:
+ ```php
+ 'custom_file' => base_path('routes/shopper.php'),
+ ```
+3. If you want to add middleware to further control access to the routes available in this file you can add in the key `middleware` of the `shopper/routes.php` file
+
+ ```php
+ 'middleware' => [
+ 'my-custom-middleware',
+ 'permission:can-access',
+ ],
+ ```
diff --git a/packages/admin/docs/content/extending/documentation.md b/packages/admin/docs/content/extending/documentation.md
new file mode 100644
index 000000000..61c22fe9a
--- /dev/null
+++ b/packages/admin/docs/content/extending/documentation.md
@@ -0,0 +1,6 @@
+- ##### Admin Panel
+ - [Overview](/docs/{{version}}/control-panel)
+ - [Navigation](/docs/{{version}}/navigation)
+- ##### Components
+ - [Forms](/docs/{{version}}/forms)
+ - [Modals](/docs/{{version}}/modals)
diff --git a/packages/admin/docs/content/extending/forms.md b/packages/admin/docs/content/extending/forms.md
new file mode 100644
index 000000000..33598eacd
--- /dev/null
+++ b/packages/admin/docs/content/extending/forms.md
@@ -0,0 +1,4 @@
+# Forms
+The forms allow us to quickly create input fields for our information to be stored in the database.
+
+Coming Soon...
diff --git a/packages/admin/docs/content/extending/modals.md b/packages/admin/docs/content/extending/modals.md
new file mode 100644
index 000000000..3cf22959b
--- /dev/null
+++ b/packages/admin/docs/content/extending/modals.md
@@ -0,0 +1,3 @@
+# Modals
+
+Coming Soon...
diff --git a/packages/admin/docs/content/extending/navigation.md b/packages/admin/docs/content/extending/navigation.md
new file mode 100644
index 000000000..a52b495bf
--- /dev/null
+++ b/packages/admin/docs/content/extending/navigation.md
@@ -0,0 +1,157 @@
+# Navigation
+The Control Panel navigation is quite customizable. You can add your own sections, pages, and subpages, as well as remove and modify existing ones.
+
+The navigation is controlled by the package [maatwebsite/laravel-sidebar](https://github.com/SpartnerNL/Laravel-Sidebar). You need to create a sidebar to add your menus within the main sidebar of Shopper. You may register your sidebar like event in the `register()` method of a service provider.
+
+## Adding Navigation
+Let’s assume we’re creating a Sidebar folder under app folder, and want to add a Blog navigation item to the Content section of the navigation. To add this item, we’ll create first a `BlogSidebar` class.
+
+There is no command to create this class so you have to create it manually and it must extend from `Shopper\Framework\Sidebar\AbstractAdminSidebar`
+
+We will have an architecture similar to this one
+
+``` files theme:serendipity-light
+app/
+ Sidebar/
+ BlogSidebar.php
+```
+
+:::info
+We assume here that you have already seen how to add routes for our administration explained in this [section](/extending/control-panel#adding-control-panel-routes).
+:::
+
+Here we will assume that our `routes/shopper.php` file contains this
+
+```php
+use Illuminate\Support\Facades\Route;
+
+Route::prefix('blog')->group(function () {
+ Route::resource('posts', 'PostController')->only(['index', 'create', 'edit']);
+});
+```
+
+:::warning
+You cannot use the notation `[PostController::class, 'index']` because this will not load and will generate an error. Everything is loaded directly from the RouteServiceProvider of Shopper
+:::
+
+Our BlogSidebar will look like this
+
+```php
+namespace App\Sidebar;
+
+use Maatwebsite\Sidebar\Group;
+use Maatwebsite\Sidebar\Item;
+use Maatwebsite\Sidebar\Menu;
+use Shopper\Framework\Sidebar\AbstractAdminSidebar;
+
+class BlogSidebar extends AbstractAdminSidebar
+{
+ /**
+ * Method used to define your sidebar menu groups and items.
+ *
+ * @param Menu $menu
+ * @return Menu
+ */
+ public function extendWith(Menu $menu): Menu
+ {
+ $menu->group(__('Blog'), function (Group $group) {
+ $group->weight(22);
+ $group->authorize(true);
+
+ $group->item(__('Posts'), function (Item $item) {
+ $item->weight(2);
+ $item->authorize(true);
+ $item->route('posts.index');
+ $item->icon('
+
+ ');
+ });
+ });
+
+ return $menu;
+ }
+}
+```
+
+Now we will register our sidebar in our **AppServiceProvider** with the `register()` method
+
+```php
+namespace App\Providers;
+
+use App\Sidebar\BlogSidebar; // [tl! focus]
+use Darryldecode\Cart\Cart;
+use Illuminate\Support\ServiceProvider;
+use Illuminate\Support\Str;
+use Shopper\Framework\Events\BuildingSidebar; // [tl! focus]
+
+class AppServiceProvider extends ServiceProvider
+{
+ /**
+ * Register any application services.
+ *
+ * @return void
+ */
+ public function register()
+ {
+ if ($this->app->isLocal()) {
+ $this->app->register(\Barryvdh\LaravelIdeHelper\IdeHelperServiceProvider::class);
+ }
+
+ $this->app['events']->listen(BuildingSidebar::class, BlogSidebar::class); // [tl! focus]
+
+ $this->app->singleton('wishlist', function ($app) {
+ $storage = $app['session'];
+ $events = $app['events'];
+ $instanceName = 'cart_2';
+
+ return new Cart(
+ $storage,
+ $events,
+ $instanceName,
+ session()->getId(),
+ config('shopping_cart')
+ );
+ });
+ }
+
+ /**
+ * Bootstrap any application services.
+ *
+ * @return void
+ */
+ public function boot()
+ {
+ Str::macro('readDuration', function (...$text) {
+ $totalWords = str_word_count(implode(' ', $text));
+ $minutesToRead = round($totalWords / 200);
+
+ return (int) max(1, $minutesToRead);
+ });
+ }
+}
+```
+
+We will have this in our sidebar
+
+
+ 
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+