feat: shimmering transcribe button (#50)
This commit is contained in:
@@ -33,6 +33,11 @@ class MeetingViewModel: ObservableObject {
|
|||||||
return generateButtonEnabled && noEnhancedNotesYet
|
return generateButtonEnabled && noEnhancedNotesYet
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Computed property to determine if Transcribe button should animate
|
||||||
|
var shouldAnimateTranscribeButton: Bool {
|
||||||
|
return !isRecording && meeting.transcriptChunks.isEmpty && !isStartingRecording
|
||||||
|
}
|
||||||
|
|
||||||
// Computed property that always uses the direct RecordingSessionManager check
|
// Computed property that always uses the direct RecordingSessionManager check
|
||||||
var isRecording: Bool {
|
var isRecording: Bool {
|
||||||
return recordingSessionManager.isRecordingMeeting(meeting.id)
|
return recordingSessionManager.isRecordingMeeting(meeting.id)
|
||||||
|
|||||||
@@ -314,7 +314,7 @@ struct MeetingDetailContentView: View {
|
|||||||
// Shimmer overlay when ready
|
// Shimmer overlay when ready
|
||||||
Group {
|
Group {
|
||||||
if viewModel.shouldAnimateGenerateButton {
|
if viewModel.shouldAnimateGenerateButton {
|
||||||
ShimmerOverlay()
|
ShimmerOverlay(color: .green)
|
||||||
.clipShape(RoundedRectangle(cornerRadius: 8))
|
.clipShape(RoundedRectangle(cornerRadius: 8))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -336,6 +336,15 @@ struct MeetingDetailContentView: View {
|
|||||||
.frame(minWidth: 110, minHeight: 36)
|
.frame(minWidth: 110, minHeight: 36)
|
||||||
.background(viewModel.isRecording ? Color.red.opacity(0.1) : Color.accentColor.opacity(0.1))
|
.background(viewModel.isRecording ? Color.red.opacity(0.1) : Color.accentColor.opacity(0.1))
|
||||||
.cornerRadius(8)
|
.cornerRadius(8)
|
||||||
|
.overlay(
|
||||||
|
// Shimmer overlay when ready to transcribe
|
||||||
|
Group {
|
||||||
|
if viewModel.shouldAnimateTranscribeButton {
|
||||||
|
ShimmerOverlay(color: .accentColor)
|
||||||
|
.clipShape(RoundedRectangle(cornerRadius: 8))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
}
|
}
|
||||||
.buttonStyle(.plain)
|
.buttonStyle(.plain)
|
||||||
.disabled(cannotStartRecording || viewModel.isValidatingKey || viewModel.isStartingRecording)
|
.disabled(cannotStartRecording || viewModel.isValidatingKey || viewModel.isStartingRecording)
|
||||||
@@ -504,6 +513,11 @@ struct MeetingDetailContentView: View {
|
|||||||
// MARK: - Shimmer Overlay
|
// MARK: - Shimmer Overlay
|
||||||
struct ShimmerOverlay: View {
|
struct ShimmerOverlay: View {
|
||||||
@State private var animate: Bool = false
|
@State private var animate: Bool = false
|
||||||
|
let color: Color
|
||||||
|
|
||||||
|
init(color: Color = .green) {
|
||||||
|
self.color = color
|
||||||
|
}
|
||||||
|
|
||||||
var body: some View {
|
var body: some View {
|
||||||
GeometryReader { geo in
|
GeometryReader { geo in
|
||||||
@@ -512,7 +526,7 @@ struct ShimmerOverlay: View {
|
|||||||
RoundedRectangle(cornerRadius: 8)
|
RoundedRectangle(cornerRadius: 8)
|
||||||
.fill(
|
.fill(
|
||||||
LinearGradient(
|
LinearGradient(
|
||||||
gradient: Gradient(colors: [Color.clear, Color.green.opacity(0.1), Color.clear]),
|
gradient: Gradient(colors: [Color.clear, color.opacity(0.1), Color.clear]),
|
||||||
startPoint: UnitPoint(x: animate ? 2.5 : -1, y: 0.5),
|
startPoint: UnitPoint(x: animate ? 2.5 : -1, y: 0.5),
|
||||||
endPoint: UnitPoint(x: animate ? 3.5 : 0, y: 0.5)
|
endPoint: UnitPoint(x: animate ? 3.5 : 0, y: 0.5)
|
||||||
)
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user