v0.0.5 ~ polished authentication flow, create pod implemented, and re…

addon/components/modals/create-pod.hbs

@@ -1,5 +1,68 @@
 <Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
     <div class="modal-body-container">
-        <InputGroup @name="Pod Name" @value={{@options.pod.name}} @helpText="Input a name for your new Pod" />
+        <form>
+            <div class="space-y-4">
+                <div>
+                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+                        Pod Name <span class="text-red-500">*</span>
+                    </label>
+                    <Input 
+                        @value={{@options.pod.name}} 
+                        placeholder="Enter pod name (e.g., 'Fleet Vehicles', 'Delivery Data')"
+                        class="form-input w-full"
+                        required
+                    />
+                    <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">
+                        Choose a descriptive name for your pod. This will be used to organize your data.
+                    </p>
+                </div>
+
+                <div>
+                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+                        Description (Optional)
+                    </label>
+                    <Textarea 
+                        @value={{@options.pod.description}} 
+                        placeholder="Describe what this pod will contain..."
+                        class="form-input w-full"
+                        rows="3"
+                    />
+                    <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">
+                        Add a description to help you remember what this pod is for.
+                    </p>
+                </div>
+
+                {{#if this.requestPodCreation.isRunning}}
+                    <div class="bg-blue-50 dark:bg-blue-900 border border-blue-200 dark:border-blue-700 rounded-lg p-4">
+                        <div class="flex items-center">
+                            <Spinner class="mr-3" />
+                            <div>
+                                <h4 class="text-sm font-medium text-blue-800 dark:text-blue-200">Creating Pod</h4>
+                                <p class="text-sm text-blue-700 dark:text-blue-300">Setting up your new pod on the Solid server...</p>
+                            </div>
+                        </div>
+                    </div>
+                {{/if}}
+
+                <div class="bg-gray-50 dark:bg-gray-800 rounded-lg p-4">
+                    <h4 class="text-sm font-medium text-gray-900 dark:text-white mb-2">What happens next?</h4>
+                    <ul class="text-sm text-gray-600 dark:text-gray-400 space-y-1">
+                        <li class="flex items-start">
+                            <FaIcon @icon="check" class="text-green-500 mr-2 mt-0.5 text-xs" />
+                            A new container will be created in your Solid pod
+                        </li>
+                        <li class="flex items-start">
+                            <FaIcon @icon="check" class="text-green-500 mr-2 mt-0.5 text-xs" />
+                            You can sync Fleetbase data to this pod
+                        </li>
+                        <li class="flex items-start">
+                            <FaIcon @icon="check" class="text-green-500 mr-2 mt-0.5 text-xs" />
+                            Data will be stored in RDF format for semantic web compatibility
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </form>
     </div>
-</Modal::Default>
+</Modal::Default>
+

addon/controllers/home.js

@@ -1,10 +1,29 @@
 import Controller from '@ember/controller';
+import { tracked } from '@glimmer/tracking';
 import { inject as service } from '@ember/service';
 import { task } from 'ember-concurrency';
+import { debug } from '@ember/debug';
 
 export default class HomeController extends Controller {
     @service fetch;
     @service notifications;
+    @service hostRouter;
+    @tracked authStatus = null;
+
+    constructor() {
+        super(...arguments);
+        this.checkAuthenticationStatus.perform();
+    }
+
+    @task *checkAuthenticationStatus() {
+        try {
+            const authStatus = yield this.fetch.get('authentication-status', {}, { namespace: 'solid/int/v1' });
+            this.authStatus = authStatus;
+        } catch (error) {
+            debug('Failed to check authentication status:' + error.message);
+            this.authStatus = { authenticated: false, error: error.message };
+        }
+    }
 
     @task *authenticate() {
         try {
@@ -20,4 +39,54 @@ export default class HomeController extends Controller {
     @task *getAccountIndex() {
         yield this.fetch.get('account', {}, { namespace: 'solid/int/v1' });
     }
+
+    @task *logout() {
+        try {
+            yield this.fetch.post('logout', {}, { namespace: 'solid/int/v1' });
+            this.notifications.success('Logged out successfully');
+            this.authStatus = { authenticated: false };
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+    }
+
+    @task *refreshStatus() {
+        yield this.checkAuthenticationStatus.perform();
+    }
+
+    @task *navigateToPods() {
+        this.hostRouter.transitionTo('console.solid-protocol.pods');
+    }
+
+    @task *navigateToAccount() {
+        this.hostRouter.transitionTo('console.solid-protocol.account');
+    }
+
+    get isAuthenticated() {
+        return this.authStatus?.authenticated === true;
+    }
+
+    get userProfile() {
+        return this.authStatus?.profile?.parsed_profile || {};
+    }
+
+    get webId() {
+        return this.authStatus?.profile?.webid;
+    }
+
+    get userName() {
+        return this.userProfile.name || 'Unknown User';
+    }
+
+    get userEmail() {
+        return this.userProfile.email || 'No email available';
+    }
+
+    get storageLocations() {
+        return this.userProfile.storage_locations || [];
+    }
+
+    get hasStorageLocations() {
+        return this.storageLocations.length > 0;
+    }
 }

addon/controllers/pods/index.js

@@ -8,6 +8,7 @@ export default class PodsIndexController extends Controller {
     @service hostRouter;
     @service notifications;
     @service filters;
+    @service fetch;
     @service modalsManager;
     @service crud;
     @tracked query = '';
@@ -85,9 +86,29 @@ export default class PodsIndexController extends Controller {
             title: 'Create a new Pod',
             acceptButtonText: 'Create Pod',
             pod: {
-                name: null,
+                name: '',
+                description: '',
+            },
+            requestPodCreation: this.requestPodCreation,
+            confirm: async () => {
+                const pod = this.modalsManager.getOption('pod');
+
+                if (!pod.name.trim()) {
+                    return this.notifications.error('Pod name cannot be empty!');
+                }
+
+                try {
+                    const response = this.requestPodCreation.perform(pod);
+                    if (response.success) {
+                        this.notifications.success(`Pod "${this.podName}" created successfully!`);
+                        return modal.done();
+                    }
+
+                    this.notifications.error('Failed to create pod.');
+                } catch (error) {
+                    this.notifications.serverError(error);
+                }
             },
-            confirm: () => {},
         });
     }
 
@@ -134,4 +155,15 @@ export default class PodsIndexController extends Controller {
         yield timeout(300);
         this.query = typeof event.target.value === 'string' ? event.target.value : '';
     }
+
+    @task *requestPodCreation(pod) {
+        const response = yield this.fetch.post('pods', {
+            name: pod.name.trim(),
+            description: pod.description.trim() || null
+        }, { 
+            namespace: 'solid/int/v1' 
+        });
+
+        return response;
+    }
 }

addon/styles/solid-engine.css

@@ -1,6 +1,4 @@
 .solid-fleetbase-home-container {
-    margin: auto;
-    width: 1200px;
     padding: 2rem;
 }
 
@@ -18,6 +16,7 @@
 
 body[data-theme='light'] .solid-fleetbase-home-container a:not([class*='text-']),
 body[data-theme='dark'] .solid-fleetbase-home-container a:not([class*='text-']),
+.solid-fleetbase-home-container a:not(.next-content-panel-header-left),
 .solid-fleetbase-home-container a {
     color: #60a5fa;
     text-decoration: underline;