Mutation IsLoading remains true in (Phetch library)
// Api.cs
public class Api
{
public Api()
{
LoginUserEndpoint = new Endpoint<Login.LoginFormModel, dynamic>(LoginUser, defaultOptions);
}
public Endpoint<Login.LoginFormModel, dynamic> LoginUserEndpoint { get; }
private async Task<dynamic> LoginUser(Login.LoginFormModel loginFormModel, CancellationToken cancellationToken)
{
var apiPath = $"{ApiBaseUrl}/{ApiEndpoint.Login.GetEnumMemberValue()}";
var response = await _httpClient.PostAsJsonAsync(apiPath, loginFormModel, cancellationToken);
if (response is null) throw new JsonException("API response was null");
return response;
}
}
// Login.razor
@code {
public readonly LoginFormModel LoginForm = new("", "");
private Query<LoginFormModel, dynamic>? _loginUserMutation;
protected override void OnInitialized()
{
_loginUserMutation = Api.LoginUserEndpoint.Use();
}
public class LoginFormModel(string username, string password)
{
[Required(ErrorMessage = "Username is required")]
public string Username { get; set; } = username;
[Required(ErrorMessage = "Password is required")]
public string Password { get; set; } = password;
}
private void HandleSubmit()
{
if (_loginUserMutation is null) return;
_loginUserMutation.Trigger(LoginForm);
Console.WriteLine(JsonConvert.SerializeObject(_loginUserMutation.Data, Formatting.Indented));
}
}
<button type="submit" disabled="@_loginUserMutation.IsLoading" class="w-full py-3 px-4 inline-flex justify-center items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none">
@(_loginUserMutation.IsLoading ? "Logging in..." : "Log in")
</button>
// Api.cs
public class Api
{
public Api()
{
LoginUserEndpoint = new Endpoint<Login.LoginFormModel, dynamic>(LoginUser, defaultOptions);
}
public Endpoint<Login.LoginFormModel, dynamic> LoginUserEndpoint { get; }
private async Task<dynamic> LoginUser(Login.LoginFormModel loginFormModel, CancellationToken cancellationToken)
{
var apiPath = $"{ApiBaseUrl}/{ApiEndpoint.Login.GetEnumMemberValue()}";
var response = await _httpClient.PostAsJsonAsync(apiPath, loginFormModel, cancellationToken);
if (response is null) throw new JsonException("API response was null");
return response;
}
}
// Login.razor
@code {
public readonly LoginFormModel LoginForm = new("", "");
private Query<LoginFormModel, dynamic>? _loginUserMutation;
protected override void OnInitialized()
{
_loginUserMutation = Api.LoginUserEndpoint.Use();
}
public class LoginFormModel(string username, string password)
{
[Required(ErrorMessage = "Username is required")]
public string Username { get; set; } = username;
[Required(ErrorMessage = "Password is required")]
public string Password { get; set; } = password;
}
private void HandleSubmit()
{
if (_loginUserMutation is null) return;
_loginUserMutation.Trigger(LoginForm);
Console.WriteLine(JsonConvert.SerializeObject(_loginUserMutation.Data, Formatting.Indented));
}
}
<button type="submit" disabled="@_loginUserMutation.IsLoading" class="w-full py-3 px-4 inline-flex justify-center items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none">
@(_loginUserMutation.IsLoading ? "Logging in..." : "Log in")
</button>
1 Reply
I am using this library called Phetch with Blazor Server - https://github.com/Jcparkyn/phetch/
Above is my code. The API request is sent properly, I recieve reponse. But for some reason,
IsLoading
remains true
after triggering