finn/forgejo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Use inline SVG for built-in OAuth providers (#25171)

Browse source 
The plan is that all built-in auth providers use inline SVG for more
flexibility in styling and to get the GitHub icon to follow
`currentcolor`. This only removes the `public/img/auth` directory and
adds the missing svgs to our svg build.

It should map the built-in providers to these SVGs and render them. If
the user has set a Icon URL, it should render that as an `img` tag
instead.

```
gitea-azure-ad
gitea-bitbucket
gitea-discord
gitea-dropbox
gitea-facebook
gitea-gitea
gitea-gitlab
gitea-google
gitea-mastodon
gitea-microsoftonline
gitea-nextcloud
gitea-twitter
gitea-yandex
octicon-mark-github
```

GitHub logo is now white again on dark theme:

<img width="431" alt="Screenshot 2023-06-12 at 21 45 34"
src="27a43504-d60a-4132-a502-336b25883e4d">

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
silverwind 2023-06-13 12:51:02 +02:00 • committed by GitHub
parent 2ad2d5a6ce
commit a51b115b0a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
34 changed files with 57 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

16
services/auth/source/oauth2/providers.go
View file

@ -5,6 +5,9 @@ package oauth2
import (
"errors"
"fmt"
"html"
"html/template"
"net/url"
"sort"
@ -19,7 +22,7 @@ import (
type Provider interface {
Name() string
DisplayName() string
IconURL() string
IconHTML() template.HTML
CustomURLSettings() *CustomURLSettings
}
@ -35,7 +38,7 @@ type GothProvider interface {
}
// AuthSourceProvider provides a provider for an AuthSource. Multiple auth sources could use the same registered GothProvider
// So each auth source should have its own DisplayName and IconURL for display.
// So each auth source should have its own DisplayName and IconHTML for display.
// The Name is the GothProvider's name, to help to find the GothProvider to sign in.
// The DisplayName is the auth source config's name, site admin set it on the admin page, the IconURL can also be set there.
type AuthSourceProvider struct {
@ -51,11 +54,14 @@ func (p *AuthSourceProvider) DisplayName() string {
return p.sourceName
}
func (p *AuthSourceProvider) IconURL() string {
func (p *AuthSourceProvider) IconHTML() template.HTML {
if p.iconURL != "" {
return p.iconURL
img := fmt.Sprintf(`<img class="gt-mr-3" width="20" height="20" src="%s" alt="%s">`,
html.EscapeString(p.iconURL), html.EscapeString(p.DisplayName()),
)
return template.HTML(img)
}
return p.GothProvider.IconURL()
return p.GothProvider.IconHTML()
}
// Providers contains the map of registered OAuth2 providers in Gitea (based on goth)

28
services/auth/source/oauth2/providers_base.go
View file

@ -3,7 +3,12 @@
package oauth2
import "code.gitea.io/gitea/modules/setting"
import (
"html/template"
"code.gitea.io/gitea/modules/log"
"code.gitea.io/gitea/modules/svg"
)
// BaseProvider represents a common base for Provider
type BaseProvider struct {
@ -21,14 +26,21 @@ func (b *BaseProvider) DisplayName() string {
return b.displayName
}
// IconURL returns an icon path for this provider
// Use svg for default icons, providers_openid has its own IconURL function
func (b *BaseProvider) IconURL() string {
name := b.name
if b.name == "gplus" {
name = "google"
// IconHTML returns icon HTML for this provider
func (b *BaseProvider) IconHTML() template.HTML {
svgName := "gitea-" + b.name
switch b.name {
case "gplus":
svgName = "gitea-google"
case "github":
svgName = "octicon-mark-github"
}
return setting.AppSubURL + "/assets/img/auth/" + name + ".svg"
svgHTML := svg.RenderHTML(svgName, 20, "gt-mr-3")
if svgHTML == "" {
log.Error("No SVG icon for oauth2 provider %q", b.name)
svgHTML = svg.RenderHTML("gitea-openid", 20, "gt-mr-3")
}
return svgHTML
}
// CustomURLSettings returns the custom url settings for this provider

9
services/auth/source/oauth2/providers_openid.go
View file

@ -4,8 +4,11 @@
package oauth2
import (
"html/template"
"code.gitea.io/gitea/modules/log"
"code.gitea.io/gitea/modules/setting"
"code.gitea.io/gitea/modules/svg"
"github.com/markbates/goth"
"github.com/markbates/goth/providers/openidConnect"
@ -24,9 +27,9 @@ func (o *OpenIDProvider) DisplayName() string {
return "OpenID Connect"
}
// IconURL returns an icon path for this provider
func (o *OpenIDProvider) IconURL() string {
return setting.AppSubURL + "/assets/img/svg/gitea-openid.svg"
// IconHTML returns icon HTML for this provider
func (o *OpenIDProvider) IconHTML() template.HTML {
return svg.RenderHTML("gitea-openid", 20, "gt-mr-3")
}
// CreateGothProvider creates a GothProvider from this Provider