Upgrading to v5 from 4.x

This upgrade guide only discusses upgrading Socialstream 5.x and assumes you are upgrading from an unaltered 4.x install. Upgrading Jetstream, Livewire, Inertia, Vue or Tailwind CSS is out of scope for this documentation. Please consult the upgrade guides for each of these packages instead.

Overview


Upgrading via socialstream:upgrade

The socialstream:upgrade artisan command is only available after installing Socialstream 5.0 and assumes you have an unaltered 4.x install.

Upgrading Socialstream has never been easier. With 5.0 we have created an artisan command that will guide you through all the changes you need to make. Simply execute the following command:

php artisan socialstream:upgrade

You may then follow the on-screen instructions to complete the upgrade to Socialstream 5.0.


Upgrading Manually

Updating Dependencies

Impact: High

Socialstream v5.0 removes laravel/jetstream as a dependency due to adding support for multiple stater kit options. Before upgrading, you should ensure that jetstream is added to the require dependencies your composer.json file. You can do this by executing the following command:

composer require laravel/jetstream:

Renaming Oauth to OAuth

Impact: High

v5 applies a patch to rename all incorrect instances of "Oauth" with "OAuth". Please make sure you have updated any usages to also match this change.

The Socialstream::refresesOauthTokens Method

Impact: High

This method has been renamed to fix the typo, if you are using the method, please update it to refreshesOAuthTokens.

The Socialstream Component

Impact: Medium

The main Socialstream component has been updated, you should replace it's contents with the one found on GitHub for your chosen Jetstream stack:

Provider Icons

Impact: Medium

The new default installation for Socialstream moves the logic for showing a providers icon to it's own component for each stack. It is recommended that you copy this logic over for your stack and update your existing Socialstream installation to reference the new component:

Livewire

Create a new provider-icon.blade.php within resources/views/components/socialstream-icons inside your Laravel Application and add the contents from here, making sure to cater for any additional icons you may have added.

Replace any @if, @elseif and @else directive calls that are used to determine what icons are shown with:

<x-socialstream-icons.provider-icon :provider="$provider['id']" class="h-6 w-6"/>

The Socialstream::providers Method

Impact: High

The Socialstream::providers method now returns an array of arrays for each registered provider. The data structure for providers is built using JoelButcher\Socialstream\Data\ProviderData::toArray and looks like the following example:

[
    'id' => 'github',
    'name' => 'GitHub',
    'buttonLabel' => 'GitHub', // configurable, can also be null.
]

Livewire Stack Changes

Add a new provider-icon.blade.php Component

This new component is a switch-case around the $provider['id'] property and used to determine which icon should be shown. You should place this component within the resources/views/components/socialstream-icons directory of your Laravel application. The source code can be found here.

You will want to include the cases for any additional providers you may have added to your Socialstream installation.

This component is referenced within socialstream.blade.php component and the connected-account.blade.php component.

Changes to connected-account.blade.php

Socialstream 5.0 updates the connected-account component to use the new provider array. You should update your version of this component to match the source code's expectations.

You should also update your applications connected-accounts-form.blade.php to reflect the change to the $provider array:

// Replace line 27
$account = $this->accounts->where('provider', $provider)->first();

// With
$account = $this->accounts->where('provider', $provider['id'])->first();

---

// Replace line 30
<x-connected-account provider="{{ $provider }}" created-at="{{ $account?->created_at }}">

// With
<x-connected-account :provider="$provider" created-at="{{ $account?->created_at }}">

---

// Replace line 47
<x-action-link href="{{ route('oauth.redirect', ['provider' => $provider]) }}">

// With
<x-action-link href="{{ route('oauth.redirect', ['provider' => $provider['id']]) }}">

---


// Replace line 72
<x-danger-button class="ml-2" wire:click="removeConnectedAccount({{ $this->selectedAccountId }})" wire:loading.attr="disabled">

// With
<x-danger-button class="ml-2" wire:click="removeConnectedAccount({{ $this->id }})" wire:loading.attr="disabled">

Inertia Stack Changes

Add a new ProviderIcon.vue Component

Socialstream 5.0 adds a new ProviderIcon.vue component. You will want to add this component from GitHub and ensure any additional provider icons you have created are catered for.

This component is referenced within Socialstream.vue and ConnectedAccount.vue.

Changes to ConnectedAccount.vue

The connected account component has been updated to reflect the changes made to the Socialstream::providers method. As a result, existing installations of this component will now break. You will want to make sure that your ConnectedAccount.vue component is updated to align with the new version on GitHub.

Changes to Auth Views

Both Login.vue and Register.vue have been updated to pass properties from $page.props.socialstream into the updated Socialstream.vue component. Please make sure to review these changes and update your application accordingly.

Changes to ConnectedAccountsForm.vue component

A lot of the logic in this component has been updated to align with the changes made to Socialstream::providers, you may wish to review the code on GitHub and update your version of the component to ensure compatibility.


The HandlesInvalidState::handle method

Impact: Low

The HandlesInvalidState contract has been updated to remove the $callback parameter, this parameter was never used by Socialstream or called in anyway. You should update your implementations to also remove this parameter.

Last updated